-
gap在Flex布局中未生效是因为旧版浏览器不支持、子项脱离文档流或存在margin干扰；Grid中gap被“吃掉”是因容器剩余空间均分导致视觉误差；column-count布局完全不支持gap。
-
摩天轮式旋转动画需两层配合：外层@keyframes控制整体匀速旋转，子项用nth-child配合rotate()和translate()实现均匀分布与正立效果，关键在transform顺序及反向旋转抵消歪斜。
-
img标签src必须为有效路径或URL，常见错误致404或空白；alt是必要语义字段，需描述性内容或留空；建议显式设置宽高防布局偏移；响应式应使用srcset+sizes而非仅CSS缩放。
-
JavaScript无法直接读取本地文件，但可通过FileAPI和FormData配合fetch实现安全上传；用input[type="file"]获取File实例，FileReader预览小文件，FormData+fetch上传并支持进度监听，URL.createObjectURL快速预览，所有操作需用户主动触发。
-
hgroup标签在现代HTML中已废弃，不该再用；HTML5曾引入它解决多级标题语义问题，但HTML5.2起被W3C和WHATWG正式移除，浏览器仅作普通容器解析，无语义或ARIA行为。
-
FOIT/FOUT是字体加载导致的文本渲染阻塞现象：FOIT为白屏，FOUT为回退字体闪现后替换；font-display:swap可立即用系统字体渲染并无缝替换，配合preload和本地字体fallback能有效优化。
-
<p>backdrop-filter直接写死易失效，因Safari等需-webkit-前缀、半透背景及will-change触发GPU加速；Less混合器可统一注入前缀、rgba透明底色和will-change，确保兼容性与性能。</p>
-
HTML暗黑模式与系统主题是两套独立机制，网页不会自动响应系统切换；需用window.matchMedia监听prefers-color-scheme变化，配合data-theme、CSS变量、localStorage及color-schememeta标签实现协同。
-
lessc默认编译慢是因为默认开启源码映射、严格语法检查及每次重复解析全部@import依赖树；watch卡住因监听粒度粗，递归扫描含node_modules的无关文件；输出冗余因未压缩、不合并选择器；API调用比命令行更可控但需手动缓存。
-
弹性盒子与网格布局混合使用错位的根本原因是容器层级职责不清、display属性覆盖或尺寸计算冲突；应由Grid负责整体二维结构划分，Flexbox负责内部一维内容对齐，并通过语义化wrapper隔离职责、合理设置min-width和轨道函数避免拉伸干扰。
-
marquee标签因非标准、无无障碍支持、无法交互且被W3C废弃而禁用；推荐用CSS@keyframes+transform:translateX()实现可控滚动，注意overflow:hidden、timing-function、iteration-count及JS交互优化。
-
闭包是模块模式实现真正私有的唯一机制，通过作用域隔离使变量无法被外部访问，所有接口函数都依赖闭包引用私有状态，ES6模块底层仍由闭包维护词法作用域。
-
答案：确保JS在HTML加载后执行的方法有四种。1.使用DOMContentLoaded事件，适合操作DOM；2.将script标签置于body底部，简单直接；3.使用window.onload，等待所有资源加载完成；4.外链JS使用defer或async属性，推荐defer以保证执行顺序。根据需求选择合适方式即可。
-
Sass@mixin是编译期样式模板，用于复用CSS规则；定义用@mixin名字($param:default)，调用必须用@include名字(...)，不返回值、不支持return或变量接收，参数默认值用冒号，$args...须置末尾，响应式应抽离断点变量并校验类型。
-
推荐用background-blend-mode混合纯色层与纹理层实现带纹理按钮，确保单条background声明、纹理no-repeat并设background-size，优先选用小尺寸SVG或CSS渐变纹理。
