-
嵌套应限于父子/状态依赖场景，深度超3层需拆分；map取值key须加引号并校验存在；@mixin生成样式块，@function返回计算值；@extend易致冗余选择器，现代项目宜用工具类替代。
-
HSL和HSLA通过色相、饱和度、亮度及透明度直观定义颜色，支持动态主题调整，比RGB更易操作，推荐优先使用。
-
for-of循环通过迭代协议遍历可迭代对象：先调用[Symbol.iterator]获取迭代器，再循环调用next()方法解构{value,done}，依done控制终止，不依赖索引或长度，专用于值序列而非属性键。
-
Vue.js数组响应式失效主因是直接索引赋值或改length；需用7个变异方法（push/pop/shift/unshift/splice/sort/reverse）或$set/splice替代；Vue3虽用Proxy增强支持，仍建议优先使用变异方法。
-
纯CSS可实现播放/暂停图标平滑切换：用两个重叠图标元素，通过opacity控制显隐并配合transform微调，避免content切换或SVG路径d属性动画等不支持方案。
-
外边距塌陷是CSS规范定义的垂直相邻块级元素margin合并行为，发生在父子或兄弟块间；行内、浮动、绝对定位元素不参与；可用BFC（如display:flow-root）或border/padding/flex等轻量方式解决。
-
必须添加<metaname="viewport">标签，否则响应式布局在手机上无法正常使用；需设width=device-width和initial-scale=1.0，禁用user-scalable=no；图片视频须加max-width:100%和height:auto；断点优先用em/rem；真机测试不可替代DevTools。
-
sticky定位需父容器提供滚动上下文，仅加sticky+top-0+z-10无效；必须父容器设h-screen+overflow-y-auto，sticky元素不能是body直系子元素，且避免transform等触发新层叠上下文。
-
Firefox50之前referrerpolicy="same-origin"无效，因解析器不识别该属性，退回到no-referrer-when-downgrade；50版起才支持。
-
必须用<button>。它是触发动作而非纯导航，能确保无障碍访问、键盘操作一致性和表单正确包含；错误使用<a>或role="link"会导致语义混乱和交互异常。
-
<inputtype="color">的默认值必须显式设置为合法7位或4位十六进制色值（如#RRGGBB），否则浏览器回退至不可靠的系统默认色；其value始终返回小写7位十六进制字符串（如#ff6b35），不支持缩写、命名色或透明度；iOSSafari15.4前不支持，15.4+需避免appearance:none等CSS干扰；兼容旧浏览器应结合JS检测并降级为带校验的文本输入。
-
Node.js是运行JavaScript服务器端代码的主流环境，因其提供fs、http等核心模块支持文件操作与网络服务，而浏览器JS缺乏这些能力；安装应选LTS版本，验证用node-v/npm-v；原生http模块可快速启动服务，需注意端口占用与res.end()完整性；package.json中type、main、scripts需按项目规范手动校准。
-
Less中@import按文本顺序内联拼接代码，变量和混合的可见性取决于导入位置；应遵循“全局→布局→组件”顺序，用(reference)只引入逻辑、(once)防重复，并注意路径解析规则。
-
computed核心作用是基于响应式数据派生可缓存的响应值；购物车总价计算是典型应用，相比methods（无缓存）和ref（需手动更新），它自动追踪依赖、按需更新；支持深层响应性与多级依赖链。
-
本文详解如何仅用CSS实现封面区域的视差滚动效果：将图片设为background-attachment:fixed的背景图，配合语义化HTML结构与响应式样式，使后续内容自然“滑过”封面，达成流畅视觉层次。
