-
table单元格width较可靠而height常失效，因行高由最高单元格决定；正方形单元格需结合tr高度、line-height、vertical-align或aspect-ratio等综合实现。
-
Modernizr是全局特性检测最省事方案，通过DOM测试而非UA判断API支持，v3+需定制构建；单API检测用in/typeof/!!组合更轻量；CSS特性优先用CSS.supports()，兼容性不足时回退到style属性探测；运行时动态检测比加载时更关键。
-
必须用<button>做汉堡菜单开关，因其原生支持可访问性；需设type="button"防表单提交，配合aria-expanded与aria-controls严格配对，并为SVG图标添加aria-hidden="true"。
-
闭包是JavaScript中保留变量值且不污染全局作用域的唯一可靠方式；其本质是内部函数引用外部变量并在外部函数返回后仍可访问，需通过返回或赋值使内部函数逃逸作用域。
-
gap在多列布局中不管用，仅对grid和flex有效；多列布局需用column-gap替代，且其与gap同名不同源，属multi-column模块。
-
Array.prototype.sort()默认按字符串字典序排序，导致数值排序错误；需传入比较函数如(a,b)=>a-b实现数字排序；它原地修改数组，稳定性和可控性不足时需手写排序。
-
::placeholder不生效主因是样式被全局重置覆盖，需用input::placeholder等具体选择器并检查开发者工具中的删除线；IE11需额外加::-ms-input-placeholder；优先用rgba()确保可访问性对比度；iOSSafari会强制缩小placeholder字体，应通过color和letter-spacing优化而非font-size。
-
使用grid-auto-rows实现响应式行高需结合minmax()、fr单位和媒体查询。1.minmax(80px,auto)设置最小行高并允许内容撑开；2.全屏布局用grid-auto-rows:1fr均分视口高度；3.媒体查询在不同断点调整列数与行高，如大屏3列60px、小屏单列40px；4.内容自适应场景用minmax(120px,max-content)平衡可读性与扩展性，配合flex布局优化卡片内容排列。
-
纯CSS下拉菜单hover失效主因是DOM间隙导致状态中断及触屏不支持；标签页用:checked+radio实现需严格结构；:focus-within需容器可聚焦且有兼容性问题；纯CSS方案存在无障碍缺失、移动端失效等固有局限。
-
JavaScript函数参数默认值在调用时实参为undefined（含不传）才启用，求值发生在调用时、函数体执行前、自身词法作用域内；null、0等falsy值不触发；解构默认值同理，且支持嵌套与作用域隔离。
-
正确写法是用Array.from(text).length统计Unicode字符数，再按正则/\u4e00-\u9fa5\u3400-\u4dbf\uf900-\ufaff/和/[a-zA-Z0-9\u0020-\u007E]/分别匹配中文、英文字符，配合防抖与composition事件处理输入法中间态。
-
可通过四种方法在百度浏览器中打开本地HTML文件：一、菜单栏“打开文件”；二、系统默认关联设置；三、拖拽至浏览器窗口；四、命令行快捷方式启动。
-
绝对定位缩略图前必须设父容器为position:relative，否则会相对于最近定位祖先偏移导致错位；top/left需手动计算，CSS变量可辅助但兼容性受限；z-index仅对定位元素生效；响应式下推荐Grid/Flexbox替代。
-
位运算通过操作二进制提升效率，如用n&1判断奇偶、n&(n-1)判断2的幂、左移右移实现乘除2的幂，异或交换变量，结合补码处理负数，适用于状态压缩、快速取模等场景。
-
父容器包含浮动元素时会因脱离文档流导致高度塌陷，解决方法有三种：1.使用clearfix类通过::after伪元素clear:both清除浮动；2.设置overflow:hidden或auto触发BFC实现包裹；3.采用display:flow-root创建无副作用BFC，现代浏览器推荐此法。
