-
grid-item动画只能用transform、opacity、filter等合成层属性；改grid-column/row无效；hover缩放需单元素加transition和transform；JSstagger动画用CSS变量控制延迟；Firefox卡顿需加translateZ(0)或will-change。
-
使用p标签创建段落，br实现换行。p用于独立意义单元，br用于同一段内分行，如诗歌或地址，确保结构清晰且语义正确。
-
绝大多数情况下应使用auto-fit，因其会合并空轨道使剩余列均分容器宽度；auto-fill则保留所有列轨道导致小屏下出现空白占位。
-
需用CSS变量接管Bootstrap颜色体系：在:root定义明色值，[data-bs-theme="dark"]中重写暗色值，并确保BootstrapCSS后加载；自定义组件须统一使用var(--bs-xxx)而非硬编码颜色。
-
用rgba()实现透明度动态化需确保第一个参数为Sasscolor类型（如$primary:#3498db），alpha用0–1小数；动态调色优先用transparentize()/opacify()；CSS变量无法在Sass中解析，运行时透明度需JS或HSL方案。
-
overflow:auto并非修复浮动溢出，而是触发BFC使父容器重新计算高度并包裹浮动子元素；它避免高度塌陷，但可能影响绝对定位、滚动行为及旧版Safari渲染。
-
PostCSS通过插件实现CSS压缩与优化，需安装postcss、cssnano和autoprefixer；配置postcss.config.js按顺序加载autoprefixer和cssnano；在package.json中添加构建脚本调用postcss-cli；集成至Vite等工具时自动应用，确保开发兼容性与生产压缩，插件顺序影响优化效果。
-
使用position:absolute可精准定位元素并结合CSS动画实现动态效果，如弹窗滑入、侧边栏展开等；通过@keyframes或transform控制位移、旋转，提升性能与视觉流畅度；需注意父级定位上下文以避免错位。
-
使用CSSGrid可高效实现宫格布局，通过grid-template-columns和grid-auto-rows定义行列，结合repeat、minmax和aspect-ratio实现等宽高、自适应与正方形单元格。
-
Promise是解决回调地狱的关键，它通过pending、fulfilled、rejected三种状态管理异步操作，支持.then()、.catch()、.finally()链式调用，提升代码可读性与错误处理能力。
-
推荐W3CNuValidator（在线）和html-validate（Node.js）；常见错误包括属性值未加引号、布尔属性重复赋值、脚本内容未转义、多余空格等；VSCode需启用相关验证设置并配置语言服务器；校验器不检测路径有效性、CSP策略或服务端模板语法。
-
HTML5中用CSS的border-radius属性实现圆角：一、统一圆角如border-radius:10px；二、四角不同如8px16px24px4px；三、单角如border-top-left-radius:12px；四、百分比如50%呈椭圆；五、图片需配合overflow:hidden裁剪。
-
IntelliJIDEA高效开发HTML5应用需完成五步：一、启用HTMLTools、JavaScript、CSS、Emmet插件；二、创建StaticWeb项目并新建index.html；三、配置JavaScriptDebug运行配置实现内置服务器实时预览；四、在HTML设置中选HTML5版本并校验语义标签；五、集成Prettier实现一键格式化。
-
<p>HTML5中<!---->注释不能用作API注释，因其被浏览器忽略、JS无法读取、文档工具不识别；有效API注释应写在JS函数上方（JSDoc）、TS类型声明旁或后端路由文件中，或通过<scripttype="application/json">嵌入结构化元数据。</p>
-
本文介绍在React应用中可靠监听浏览器后退操作（如点击返回按钮或调用history.back()），并在用户确认后执行登出逻辑的完整实现方案，避免原生popstate事件失效问题。
