-
flex-direction决定主轴方向，影响子元素排列走向及justify-content、align-items的行为逻辑：row（左→右）、row-reverse（右→左）、column（上→下）、column-reverse（下→上），且与书写方向无关。
-
根本原因是换行后margin仍作用于每行首尾元素导致间距不均，gap可完美解决；兼容IE需用nth-child伪类清除边界margin，并注意justify-content对齐方式的影响。
-
pointer-events:none不生效的主因是父元素未生效或子元素显式设为auto覆盖；它使元素及后代不参与鼠标事件目标计算，但不影响键盘焦点与语义状态。
-
overflow:auto在移动端不生效主因是容器无明确height/max-height，导致无法判定溢出；需配合max-height、min-height:0（Flex场景）、-webkit-overflow-scrolling:touch（iOS）及避免position:fixed干扰。
-
样式不生效的三大主因是：link未放head内导致FOUC、href路径错误、rel="stylesheet"属性缺失或拼写错误；需确保link在head中且位于script前，路径正确，rel属性严格匹配，并配置服务器返回text/css响应头。
-
float会让li的圆点/数字消失，因为list-style标记渲染在li的外边距区域，而浮动使li脱离文档流，导致该区域无法渲染；推荐改用display:flex或inline-block实现横排。
-
通过容器包裹实现横向滚动，设置overflow-x:auto与max-width:100%防止布局溢出，结合-webkit-overflow-scrolling:touch提升iOS流畅度；利用::-webkit-scrollbar自定义滚动条样式，增强视觉美观；移动端可采用卡片布局切换与手势优化，辅以可访问性提示，确保响应式表格在各设备上兼具功能与体验。
-
能，但需满足HTTPS协议（含localhost）和用户主动触发两个前提；调用前须检测支持性，失败需按error.code分类处理；watchPosition()依赖系统定位服务变化触发，非轮询；WebWorker中不可用。
-
transition必须写在基础样式里，否则首次hover无动画；应避免all，优先用transform和opacity实现GPU加速；移动端需处理300ms点击延迟。
-
CSS优先级由选择器权重(a,b,c,d)决定，逐位比较不加总；!important仅提升单条声明优先级，不改变选择器权重。
-
应优先使用margin-inline而非margin-left/margin-right，当边距沿文本流方向（如按钮组、表单控件水平间距）且需自动适配LTR/RTL时；margin-block则用于块轴，其起始端由writing-mode决定而非direction，降级需用@supports+dirfallback。
-
优先用position:sticky，它天然支持文档流、不脱离布局、兼容性足够；仅需兼容IE或强制视口钉死时才用fixed，并手动给body加padding-top避免遮挡内容。
-
match()提取匹配内容返回数组或null，search()定位首个匹配位置返回索引或-1；前者关注“有哪些”，后者关注“在哪”，用途、返回值及标志支持均不同。
-
fieldset+legend是唯一原生支持语义分组、禁用传播和屏幕阅读器正确播报的方案；div+h3等替代方式无法实现禁用继承、组名播报及表单API逻辑识别。
-
能做，但外层必须设position:relative且有明确宽高（如width:300px或100%且父级有宽），否则内层absolute的width百分比无效；推荐width+background-color方案，兼顾兼容性与性能。
