-
nth-child选择器按元素在父容器中的位置应用样式，常用于实现表格或列表的奇偶行交替样式。其语法为:nth-child(an+b)，odd和even是常用简写，分别对应2n+1和2n。例如tabletr:nth-child(odd)设置奇数行背景色，ulli:nth-child(even)设置偶数项样式，实现斑马条纹提升可读性。需注意nth-child基于所有子元素计数，不区分标签类型，若需按特定标签排序应使用nth-of-type。
-
用HSL调提示色更直观可靠，因H、S、L三维度独立可控；推荐参数：H90–160°、S60%–85%、L80%–92%，并确保文字对比度≥4.5:1。
-
clip-path动画卡顿或跳变是因为关键帧间无法插值，仅inset()和circle()等数值型函数支持线性插值，polygon()或path()因坐标数量/结构不一致会直接跳变；应统一函数类型、固定顶点数与顺序，或改用SVG/SMIL/GSAP。
-
Flex项目height:100%需父容器有明确高度（如min-height:100vh），否则失效；应优先用flex:1填满剩余空间，并配合overflow-y:auto和min-height:0控制溢出；IE11需额外处理height:100%兼容性。
-
transform:scale()用于无损缩放，scale(x)水平缩放，scale(x,y)分别控制XY轴，scale(1)为原尺寸，scale(0)视觉消失但占位；需配合animation与完整transform声明使用，注意transform-origin和图层优化。
-
启用u修饰符是解决JavaScript正则处理Unicode字符出错的关键，它使引擎以Unicode代码点为单位匹配，支持\p{...}、正确解析emoji和重音字符、量词作用于完整字符，并要求现代环境支持。
-
用margin控制段落上下间距最可靠，因其直接修改浏览器默认的margin-top和margin-bottom，通用性强、不影响行高与字体渲染，且可单独设置；line-height仅影响段内行距，gap适用于Flex/Grid容器但不兼容IE，而<br>或空<p>则破坏语义且不可控。
-
端云协同的前端边缘计算架构本质是让前端具备就近决策能力与按需回源策略，云端仅负责状态同步、模型下发和策略编排；真正在浏览器运行的边缘逻辑须满足轻量、可验证、可灰度、可降级四约束，WebAssembly因体积小、启动快、内存隔离、支持多语言编译且适配算法密集型任务，成为当前最可行的边缘逻辑载体；ServiceWorker应作为策略网关实现动态边缘路由，依据设备能力与网络类型决策是否启用边缘逻辑或拦截请求；边缘策略与模型下发需通过签名校验、版本锁定和灰度开关三位一体机制保障安全可控；所有边缘逻辑入口必须由全局
-
应使用overflow-wrap:break-word+white-space:normal+明确宽度三件套；word-wrap已废弃，white-space优先级更高，Flex/表格等特殊布局需额外处理。
-
<p>Safari15.4及更早版本不支持calc()嵌套，会静默丢弃整条声明；应改用CSS变量分步计算，如--inner-width:calc(100%-40px);width:calc(var(--inner-width)/3)。</p>
-
本文详解React中因直接修改数组（如splice）导致状态更新失败的问题，说明为何组件不重新渲染，并提供不可变数据操作、key正确设置等完整解决方案。
-
直接改:root颜色变量失效，是因为CSS变量存在作用域和层叠顺序：后声明覆盖前声明，组件级样式会局部覆盖全局变量；应统一在:root顶部声明且不重复定义，避免硬编码重写，并检查构建工具插入顺序。
-
Map的set和get方法支持任意类型键，区别于Object的字符串强制转换；set可存对象、NaN等，get严格匹配且不类型转换，适用于缓存、DOM关联、Symbol键等场景。
-
::file-selector-button仅在type="file"的input直接子元素上生效，需设display:block/inline-flex；不可用display:none或visibility:hidden；Firefox117+才支持；仅支持有限样式属性，appearance:none须作用于input本身而非伪元素；点击区域由input尺寸和定位决定。
-
必须用timeout参数兜底，否则低性能设备或复杂页面下可能永远等不到空闲；回调中需通过deadline.didTimeout区分触发原因，并据此调整执行策略。
