-
Less嵌套不改变CSS权重，关键在编译后选择器字符串；应显式用>、禁用空格、&开头写伪类，避免超3层嵌套和跨区域硬套。
-
script-src白名单需用单引号包裹、空格分隔，仅列必需来源；必须显式写'self'，不支持通配符或路径；内联脚本默认被禁，应优先用HTTP响应头配置并配合Report-Only模式调试。
-
grid-row与grid-column用于精确控制网格项的行和列位置，支持通过数字、span关键字或命名线定义起始与结束线，实现灵活布局；使用span可简化跨行列设置，命名线提升代码可读性，配合z-index处理重叠，合理规划可构建清晰高效的复杂网格布局。
-
Flex容器必须设为display:flex或inline-flex，否则子元素flex属性无效；子项宽度靠flex-grow与flex-basis配合，flex:1等价于flex:110%，非“占满”；高度自适应需确保父级有明确高度，推荐min-height:100vh；flex-wrap不控制列数，order影响视觉顺序但不利SEO；flex-shrink:0易致横向溢出。
-
空白页主因是document.write()在加载后清空页面，或HTML未正确加载、JS报错阻塞、CSS隐藏内容；应按Network→Console→Elements顺序排查。
-
本文详解如何基于Tocca.js在移动设备上为元素绑定swipeleft/swiperight事件，并解决常见点击触发失效问题，确保滑动后能正确执行跳转或自定义逻辑。
-
将扁平菜单转为树形结构需两次遍历：首次用对象缓存节点并初始化children，识别根节点；第二次将非根节点挂载到父节点children下，时间复杂度O(n)。
-
计算属性名作为类静态成员时，初始化顺序问题本质是字段按声明顺序逐行执行、实时求值，而计算属性名中的引用若依赖尚未初始化的同级或后续静态成员会报错；应优先使用staticblock明确控制顺序，或提前在外部计算键名。
-
目前无法通过CSS伪类如::picture-in-picture-progress直接设置画中画（PiP）窗口内进度条的样式，因为该伪类并非标准且不受支持，浏览器对PiP内部UI的自定义权限极为有限，以确保安全性和一致性，开发者只能在视频进入PiP模式前通过构建自定义HTML5播放器来实现个性化进度条等控件，而::picture-in-picture伪类仅能作用于视频元素本身，无法影响PiP窗口内部的播放控制界面，因此完全自定义PiP进度条在当前Web标准下不可行。
-
insertAdjacentHTML比innerHTML快，因其跳过序列化现有DOM的步骤，直接解析插入HTML字符串，不重建原有子节点；实测插入100条列表项时快2–4倍。
-
CSSGrid用auto-fit与minmax()实现响应式图片网格，避免flex-wrap断行错位；用figure包裹图文并设display:inline-block保证布局；图片错误监听onerror降级，dialog实现轻量预览，状态同步优先class切换。
-
原生<ul>嵌套是最稳的方案，不依赖JS、不靠第三方库、打开即见结构；必须用<li>包裹内容、子<ul>嵌在<li>内，用margin-left和伪元素控制缩进与连线，确保跨浏览器及PDF导出稳定。
-
localStorage数据永久存储且同源标签页共享，适合长期偏好和登录态；sessionStorage仅限当前标签页，关闭即清空，适用于表单草稿等临时状态；二者均只支持字符串，需手动JSON序列化，且localStorage可监听其他页变更而sessionStorage不可。
-
能，但仅限于内联事件处理器中直接returnfalse时生效；现代推荐用event.preventDefault()，语义清晰且兼容异步流程。
-
Grid容器overflow不生效最常见原因是子元素未超出容器空间或父容器高度未约束；需设明确高度、min-width:0/min-height:0、避免fr滥用、正确作用滚动样式于直接包裹内容的容器。
