-
X-Frame-Options已被现代浏览器逐步弃用，应优先使用Content-Security-Policy的frame-ancestors指令替代；仅当需兼容IE10/11等旧浏览器时，才可将其作为兜底方案。
-
Grid布局与Float共存时需隔离影响，避免在Grid项目中使用float，通过clear或BFC清除外部浮动，并采用渐进式迁移策略实现平滑过渡。
-
本文介绍一种基于正则表达式的字符串智能分段方法：在不超过各字段长度限制（如15/10/10）的前提下，优先在空白符处断行，确保不切割单词，适用于地址、标题等需语义完整性的多字段拆分场景。
-
本文介绍在PHP后端对数据库查询结果进行字母序排序后渲染下拉菜单的方法，通过usort()配合飞船运算符实现全名（姓+名）升序排列，确保前端<select>显示整洁、可读性强。
-
必须用HTTP服务托管HTML，因file://协议导致手机扫码拒绝加载；二维码需动态生成且目标URL为完整可访问地址；须添加viewport元标签并确保路径、视口、资源加载一致。
-
.header.navlia比.nav-link慢，因浏览器从右往左匹配，需对每个a元素向上回溯多层父级；层级越深、DOM节点越多，性能损耗越大，应优先使用单类名并控制嵌套不超过2层。
-
用aspect-ratio实现圆形标签需兼顾文字自适应与兼容性：设aspect-ratio:1/1和border-radius:50%，配合font-sizeclamp()、flex居中、box-sizing:border-box，并为旧浏览器降级使用padding-top:100%或固定尺寸。
-
本文详解Expo应用中useFonts返回true却字体不生效的典型原因：handleOnLayout回调未被实际触发，导致SplashScreen未正确隐藏、UI未重绘，最终字体样式无法应用。
-
合法迭代器对象必须有next()方法，且每次调用返回{value:any,done:boolean}结构的对象；done为true表示遍历结束，value可存在（如return值）。
-
最稳方式是父容器设position:relative，图标用position:absolute+right/em+top:50%+transform:translateY(-50%)，并统一box-sizing:border-box。
-
推荐本地化FontAwesome并用CSS类语义化管理图标，通过::before+content绑定Unicode值，确保font-family和font-weight匹配字体文件，避免CDN不稳定及HTML硬编码问题。
-
floatleft左右并排不生效主因是父容器未清除浮动致高度塌陷，或子元素width+padding+border超100%；百分比宽度按父内容区计算，混用inline-block会引发空白；现代布局应优先使用flex或grid。
-
HTML5真正新增且有明确语义的标签是<header>、<footer>、<article>、<section>、<aside>、<nav>、<main>；它们各自承担不可替代的结构角色，需按语义正确嵌套使用，而非仅作样式容器。
-
table边框重叠不生效需设border-collapse:collapse于table元素；缝隙常因padding或边框不统一导致；突出行列须操作td/th而非tr；响应式建议配合table-layout:fixed和visibility:collapse隐藏列。
-
:only-of-type不生效是因为它仅当父元素下同标签名子元素唯一时才匹配，无视class、id等属性；若存在多个同类型元素（即使隐藏），即失效。
