-
推荐使用CSSGrid实现弹性网格卡片布局，因其二维布局能力更强、代码更简洁且响应式表现优异；通过grid-template-columns:repeat(auto-fit,minmax(200px,1fr))可自动调整列数并填满容器，配合gap设置间距，无需媒体查询即可实现自适应；Flexbox方案适合一维布局，使用flex-wrap:wrap和flex:11200px实现卡片换行与伸缩，兼容性较好但控制较弱；根据项目需求选择，现代布局优先推荐Grid。
-
AbortController仅提供中止信号，不支持去重和熔断；需在其上封装请求指纹标准化（URL+method+body+关键headers）、Map缓存、滑动窗口失败计数及跨请求共享的熔断状态管理。
-
HTML无法实现图标搜索，需JavaScript动态过滤渲染：监听input事件，用Array.filter()和String.includes()匹配图标名，避免DOM频繁重绘，推荐CSS类或SVGsprite，自定义图标须注册到FontAwesome库。
-
必须通过本地HTTP服务器运行，不能用file://协议直接打开；因浏览器安全限制，fetch、XMLHttpRequest、ES6模块等无法执行，且路径错误会导致404或空白页。
-
容器查询无法直接按字数响应，因CSS无字符串函数；可行方案是JS测字数并注入CSS变量驱动字号，或用容器高度变化间接模拟字数档位，但后者受字体、断行等影响大。
-
纯CSS主题色缓动的关键是给使用变量的属性（如color、background-color）加transition，而非给CSS变量本身；JS仅切换data-theme等状态，由CSS响应并插值。
-
视频网站首页需解决三大技术难题：背景视频防跳动（fixed+object-fit+autoplay+muted+playsinline）、多列卡片错位（flex布局+aspect-ratio+flex-shrink:0）、多区域同步播放（单video+canvas逐帧绘制+显式设置canvas尺寸）。
-
中文排序必须用Intl.Collator('zh',{sensitivity:'base'})，因localeCompare依赖系统locale不可靠；'zh'是最稳妥locale值，sensitivity:'base'忽略声调适配商品名；需避免重复创建实例、确保ICU支持、清理不可见字符。
-
本文详解如何为带行号的textarea编辑器添加可靠的“跳转到行”与“查找文本”功能，利用原生scrollIntoView()精准定位目标行，避免手动计算滚动偏移带来的误差。
-
将响应式布局改为固定宽度布局的核心是删除所有流式相关CSS并锁定容器宽度：删掉viewport缩放控制、清除百分比/相对单位、移除媒体查询、覆盖框架容器断点、重置图片iframe的max-width。
-
iOSSafari的overscroll-behavior:none仅对内部可滚动元素生效，对body/html根层无效；touch-action:none需作用于有高度、overflow且内容溢出的容器才有效。
-
纯HTML无法实现真正可用的柱状图，必须结合CSS样式与JavaScript逻辑或使用Chart.js等图表库；手动用div模拟存在数据绑定缺失、无坐标轴、不响应式及无障碍支持差等问题。
-
WebWorker必须使用外部JS文件启动，不支持dataURL或内联脚本；需同源、可fetch加载，禁用file://协议；不支持DOM操作；传大对象应使用transferable避免拷贝；需分别监听worker.onerror、onmessageerror及self.onerror捕获错误；共享内存需SharedArrayBuffer+Atomics并启用COOP/COEP跨域隔离。
-
字体大小影响换行，但非唯一因素。font-size增大会增加字符宽度，可能导致换行，但实际换行还受容器width、white-space、word-wrap、word-break及文本内容影响。例如white-space:nowrap会禁止换行，即使字体很大；而word-wrap:break-word可让长URL在容器内断行。使用br标签或word-break:break-all可强制换行。响应式设计中，可通过媒体查询调整font-size和换行属性适配不同屏幕，确保布局美观。
-
横屏时flex容器不换向需用宽高比或宽度断点替代orientation查询，检查flex-direction是否被高优先级样式覆盖，确保flex-wrap未锁死换行，并同步调整子项宽度、字体、间距及触摸目标尺寸。
