-
在移动端，关闭覆盖式对话框后常意外触发底层元素的click事件（如对话框重新弹出），根本原因是touch交互会触发后续的模拟click。本文提供兼容pointer与touch的可靠解决方案。
-
HTMLGrid会显著削弱IE支持，IE10完全不支持，IE11仅支持2011年旧草案的-ms-grid语法，现代grid语法（如display:grid、grid-gap、grid-template-areas）被直接忽略或导致布局错乱，无法与-ms-grid兼容混用。
-
columns才是报纸式排版的正解，因其支持自动断行、语义完整、跨列标题及响应式列数；grid会破坏文本流、无法自动分栏、丧失可访问性且维护成本高。
-
直接改height不生效，因Bootstrap进度条高度由.progress的height和.progress-bar的line-height共同决定，且受::after伪元素影响；需同步调整三者并匹配border-radius。
-
用position:absolute+top:0+left:0+width/height:100%使图片叠于父容器左上角，父容器需设position:relative和明确高度，配合z-index与opacity切换，预加载图片并用object-fit:cover防变形。
-
box-sizing:border-box是将border和padding计入width/height的计算基准；默认content-box会使实际宽高超出设定值，导致布局错位；推荐全局用、::before、*::after设置，并注意第三方库、内联样式及iframe需单独处理。
-
<ins>是语义化标记新增内容的内联元素，需配合datetime属性（ISO8601格式）才具备机器可读语义，用于版本对比等场景，不参与表单提交、SEO或事件触发。
-
ASP中稳妥渲染HTML5列表需分段输出标签、对内容调用Server.HTMLEncode()清洗、用计数器而非AbsolutePosition控制序号、Split后Trim并跳过空项、仅输出语义化class与data属性。
-
:hover伪类必须配合具体元素选择器使用，如button:hover；单独写:hover无效；支持a、.nav-item、div等可交互元素，但移动端Safari对非可点击元素支持不稳定。
-
将移动和旋转合并到同一个transform中，通过单一@keyframes动画控制，可确保CSS元素的平移与旋转完全同步。示例：使用@keyframesmoveAndRotate定义从translateX(0)rotate(0deg)到translateX(200px)rotate(360deg)的动画，并应用于元素；若需调整旋转中心，可设置transform-origin为center或指定坐标；避免同时使用多个animation属性（如slide和spin），以防因渲染差异导致不同步；如需分阶段效果，
-
JavaScript虽非纯函数式语言，但可通过规避副作用、坚持不可变性、避免共享状态来写出接近纯净的函数式代码；纯净函数要求相同输入恒得相同输出且无任何可观察副作用。
-
原生template标签仅作内容占位，不自动渲染或绑定数据，需手动克隆content并配合Mustache、newFunction等方案实现批量HTML生成。
-
Glob与正则表达式用途不同：Glob专用于路径匹配、语法简洁；正则用于通用文本匹配、功能强大但复杂。二者不可直接等价，转换需注意*→1、→(?:1/)1、?→1等规则，并处理转义、边界和平台差异。/↩
-
HTML语义化虽不直接提升排名，但影响搜索引擎对页面结构、主次关系和可信度的判断；错误使用<main>、<article>、<nav>、<aside>及缺失标题体系均会降低内容权重与索引质量。
-
必须写alt属性，因它是可访问性合规与SEO的基础要求；缺失会导致屏幕阅读器跳过图片、加载失败无提示、搜索引擎不收录、WCAG审计失败等问题。
