-
grid-column-gap控制列间水平间距，row-gap控制行间垂直间距；前者作用于列轴，后者作用于行轴，两者均推荐用column-gap和row-gap替代以提升跨布局通用性。
-
Nginx能做WebSocket负载均衡，但必须配置proxy_http_version1.1、Upgrade/Connection头透传、proxy_read_timeout与proxy_send_timeout延长至86400、禁用缓冲，并依后端状态选择ip_hash或least_conn算法。
-
文字环绕浮动图片需用float:left/right，图片须为普通流内元素并设width和margin；后续块级元素可能清除浮动导致环绕失效，关键在父容器与兄弟元素的样式交互。
-
z-index在3D场景中失效是正常现象，因浏览器按Z轴实际坐标（如translateZ值）而非z-index数值决定渲染顺序；需通过调整transform中的Z值精确控制前后关系。
-
跨域请求因浏览器同源策略被阻止，是安全机制而非bug；解决方式主要有CORS（服务端配置响应头）、JSONP（仅GET，已淘汰）和代理服务器（开发常用），推荐优先配置CORS。
-
nonce是CSP中授权内联脚本执行的一次性随机字符串，需服务端同步生成并严格匹配响应头script-src'nonce-xxx'与标签nonce="xxx"属性，否则静默失效。
-
用min-height:100vh撑满视口最可靠，避免height:100vh截断内容；推荐设在主容器而非html/body；配合Flex布局（父容器flex-column+min-height:100vh，主内容flex:1）可实现页脚粘底；iOSSafari需注意vh兼容性，可用JS动态适配或回退height:100%。
-
animation-play-state是唯一能真正暂停并从断点继续的原生方案，仅适用于纯CSS@keyframes动画；Canvas、Three.js和requestAnimationFrame动画需手动管理时间戳与状态，否则暂停后会重头开始或跳变。
-
display:inline-block是分页按钮的常见选择，因其支持并排排列、宽高设置且不脱离文档流，兼容IE8+；但需处理换行间隙，常用font-size:0或无空格HTML解决。
-
可通过自定义tailwind.config.js中theme.extend.gridTemplateColumns添加动态列配置，如'5':'repeat(5,minmax(0,1fr))'，再配合gap工具类与min-w-0等处理溢出和错位问题。
-
findLastIndex更可靠因其规范定义逆向遍历逻辑，从末尾起查首个匹配项即返回，避免手写循环的边界错误、索引错位及语义混淆，天然适配“最后一个生效操作”场景。
-
html-minifier的--minify-jstrue选项需依赖terser且仅压缩内联脚本：若未安装terser、语法不兼容、含module/nomodule属性或危险语句，会静默跳过；它不处理外部JS，也不跨script块优化，压缩效果取决于原始JS质量。
-
Bootstrap.badge垂直对齐需按场景定制：按钮内用vertical-align:text-bottom加微调，混排推荐inline-flex容器，表格中确保td未重置vertical-align，SVG场景需先清除内联对齐。
-
必须缓存DOM查询结果，因每次调用getElementById或querySelector都会遍历DOM树，开销大；应提前获取并存为变量，如constsaveBtn=document.getElementById('save-btn')，避免重复查询。
-
子菜单飘到页面左上角是因为未给父<li>设position:relative，导致absolute子菜单向上回溯至<body>定位；每级可展开<li>都须显式设relative，避免overflow:hidden裁剪，并采用递进式定位策略解决多层打架问题。
