-
行高（line-height）通过控制文本行间距提升可读性与视觉效果，支持无单位数值、带单位长度、百分比和normal等取值；推荐使用无单位数值（如1.5），能基于字体大小按比例计算并良好继承；每行文本形成“行框”，line-height决定其高度，超出font-size的部分均分于文字上下，实现宽松布局；正文建议设为1.5，标题可设1.2~1.3，单行文本垂直居中可通过line-height等于容器高度实现，避免过小行高导致拥挤。
-
箭头函数无自有this、不可构造、无arguments、无yield、返回值需注意隐式规则：其this沿用外层，不能new调用，不支持arguments和yield，单表达式自动返回，对象字面量须用小括号包裹。
-
浮动广告导致父容器塌陷时，clear并非万能解药，因其仅对后续非浮动块级元素生效；推荐用display:flow-root或overflow:hidden闭合浮动，语义更清晰且无副作用。
-
transition-delay需≥transition-duration才能实现连贯往返效果，推荐设为duration×2；必须写在默认状态而非:hover中；在@keyframes中无效，应改用animation-delay。
-
需借助工具链模拟渲染路径识别未用CSS，静态分析易误删动态类，推荐purgecss-webpack-plugin处理自定义全局样式并配置白名单，Coverage仅作线索不可直接删。
-
background-size动画无效是因为关键词（如cover）不可插值，须用具体数值（如102%98%）；容器需有明确尺寸且避免fixed定位；iOSSafari需加translateZ(0)触发硬件加速。
-
CSSGrid布局通过定义容器、行列尺寸、网格线定位、隐式轨道和区域命名实现复杂二维布局。1、设置display:grid启用布局；2、用grid-template-columns/rows定义列宽行高，支持repeat()函数；3、通过grid-column/row-start/end或简写属性按网格线定位项目；4、超出范围时由grid-auto-rows/columns和grid-auto-flow控制隐式轨道；5、使用grid-template-areas命名区域并结合grid-area分配子元素，
-
使用display:flex和align-items:center可使标题与按钮在同一行垂直居中，通过gap控制间距，清除默认margin并统一line-height避免错位，结合flex-wrap:wrap支持响应式换行，确保布局在不同屏幕下均对齐良好。
-
CSS预处理器如Sass、Less、Stylus通过变量、嵌套等特性增强CSS；2.Tailwind、Windi等实用类框架提供原子类名快速构建UI；3.Bootstrap、Bulma等组件化框架集成完整设计系统，适合快速开发；4.Styled-components、Emotion等CSS-in-JS方案实现样式作用域与动态控制；选择工具需结合项目规模与技术栈，合理配置以提升效率与维护性。
-
font-smoothing在哪些浏览器里根本没用font-smoothing是WebKit内核专属的非标准属性，只在Safari和旧版Chrome/Edge（基于Blink但早期沿用了WebKit前缀）中生效。Firefox完全忽略font-smoothing，现代Chrome（110+）、Edge（110+）也已移除对它的支持——不是“不推荐”，是直接不解析。常见错误现象：font-smoothing:antialiased在Firefox或新版Chrome
-
用单个<audio>元素配合JavaScript实现播放列表：通过JS切换src或<source>并调用load()和play()，避免多<audio>浪费资源；注意iOS限制（如loop、volume不可JS设置）、preload策略及autoplay策略限制。
-
在Next.jsAppRouter中定义API路由时，必须显式返回NextResponse实例；若函数无返回值（即隐式返回undefined），运行时会因尝试读取undefined.headers而抛出TypeError。
-
本文详解如何在React应用中安全、稳定地实现消息数组的定时轮播（每5秒切换一条），涵盖useEffect+setInterval的正确用法、避免闭包陷阱、防止内存泄漏，并提供可直接运行的函数组件示例。
-
使用CSStransition和:hover实现列表项悬停过渡效果更高效，通过设置transition属性可使背景色、文字颜色或位移等变化平滑进行，如配合transform:translateX()增强交互感；若需复杂动画，则可用@keyframes定义关键帧并结合animation属性控制过程，推荐使用cubic-bezier缓动函数提升视觉体验。
-
HTML5的play()仅控制视频播放，弹幕需JavaScript手动实现：解析数据、创建元素、计算轨迹、定时渲染；须监听timeupdate事件、处理自动播放策略、单独加载弹幕文件。
