-
移动端点击高亮是iOSSafari和部分安卓浏览器默认添加的半透明灰色overlay，由-webkit-tap-highlight-color控制，需禁用以保障自定义交互样式一致性；Tailwindv3.0+需在corePlugins中启用tapHighlightColor开关并重启服务方可使用tap-highlight-transparent工具类。
-
CSSHoudini通过多个API让JavaScript直接操作浏览器渲染引擎，实现更灵活的样式控制。1.CustomPropertiesandValuesAPI支持定义带类型的CSS变量并进行动画；2.TypedOMAPI提供带单位的数值对象，提升性能和安全性；3.CSSParserAPI允许自定义CSS解析规则；4.PaintAPI通过PaintWorklet实现自定义绘制效果，如棋盘格背景；5.AnimationWorkletAPI创建高性能线程级动画；6.LayoutAPI自定义布局算法，如瀑布流
-
通过CSS的:focus伪类和transition实现输入框边框颜色动画，聚焦时边框平滑变色，结合box-shadow与@keyframes可创建脉冲等动态效果，提升表单交互体验。
-
CLS是衡量页面视觉稳定性的指标，非优化工具；高CLS常因img/iframe缺尺寸属性、字体切换导致容器高度变化、动态内容未预留空间所致，需从资源加载、尺寸预设和DOM插入时机三方面系统优化。
-
dash.js需配合正确HTML与配置才能实现DASH自适应播放：MPD须HTTPS提供且响应头含application/dash+xml，移动端需video标签添加muted、playsinline及viewport限制，容器须用aspect-ratio或padding-bottom维持宽高比，video设object-fit:cover防拉伸。
-
纯HTML无法实现倒计时，必须用JavaScript实时计算时间差并更新DOM；正确做法是固定目标时间戳，每次用Date.now()重算差值，避免递减变量，合理清理定时器并注意时区问题。
-
BEM规范与PurgeCSS需形成闭环：BEM提供可预测类名结构，PurgeCSS才能精准删除未用样式；动态拼接类名、第三方组件未显式引用、BEM不规范、未设白名单是常见失效原因。
-
浮动元素不创建层叠上下文，故z-index无效；其z轴顺序由所在层叠上下文决定，需用position+z-index替代float来精确控制遮挡关系。
-
本文介绍如何改造基础Tampermonkey脚本，使其支持同时检测多个关键词：若任一关键词存在则弹窗提示并可扩展通知；若全部缺失则自动刷新页面。
-
不能完全绕过CSS，但可由JS主导主题决策并分发：先读取localStorage或系统偏好确定主题，再通过data-theme属性通知CSS生效，同时统一所有入口的判断逻辑以防闪跳。
-
<p>不够。单纯用em/rem会导致视口缩放或根字体变化时间距意外缩放，应改用CSS变量配合calc()做断点内插值，如--spacing-sm设为无单位数值4，再用calc(var(--spacing-sm)*1px)调用。</p>
-
Chrome57以下不支持display:grid，仅Chrome57+稳定支持标准语法；旧版需用-webkit-grid前缀且功能受限；推荐渐进增强（flex基础+@supports覆盖）或服务端UA判断降级。
-
现代表格结构底线是必须使用thead和tbody：thead必须在tbody前，仅含th元素以确保语义化；tbody是唯一允许动态操作的区域；三者须同级直属于table，列数严格对齐，否则影响可访问性、固定表头、打印及JS操作。
-
Sass变量命名应以可维护性优先，采用$color-blue-500、$space-md等带层级和单位的格式；嵌套不超过三层，超层用BEM平铺；mixins所有非核心参数须设默认值；全项目统一使用@use，禁用@import混用。
-
clip-path是实现撕裂边缘最轻量方案，用polygon定义长短错落的锯齿坐标，需闭合路径并兼容旧Safari；叠加透明PNG撕裂图可增强质感，需精准定位、禁用重复；伪元素::before偏移叠加可模拟厚度感；移动端需注意性能与格式优化。
