-
父容器高度塌陷时应设position:relative激活定位上下文,使absolute子元素相对于它定位;父容器需有明确尺寸或由其他非absolute内容撑开,不可依赖absolute元素反向撑高。
-
最轻量可控的屏蔽方式是在Patch操作前加逻辑判断。需检查必填字段非空、人员字段已选、避免重复提交;将Patch移至确认按钮而非OnChange触发;结合FormMode控制适用范围,确保仅在条件完备时执行。
-
仅靠object-fit:cover无法实现真正可靠的移动端全屏视频背景自适应,必须配合muted、playsinline、autoplay、preload等HTML属性,JavaScript主动播放控制,body{overflow-x:hidden}裁剪水平溢出,以及viewportmeta声明,才能解决播放失败、强制跳转、滚动条、裁切关键内容等核心问题。
-
制定JavaScript代码规范的核心目标是提升代码可读性、可维护性和团队协作效率。通过使用ESLint和Prettier统一代码风格,结合husky与lint-staged实现提交前自动化检查;命名上采用语义化的小驼峰式变量函数名、大驼峰式类名、全大写常量名,并用is/has/should前缀标识布尔值;保持文件职责单一,采用ES6模块语法,控制函数长度并合理使用解构赋值与箭头函数;在安全方面强制使用===比较,禁用var,捕获异常并校验用户输入。团队应基于Airbnb或Google规范裁剪出适合项目的
-
min-width不生效的四大主因是盒模型设置、父容器约束、浏览器内置样式及calc()语法错误;需统一box-sizing:border-box、检查flex收缩、重置-webkit-appearance、确保calc空格与变量定义。
-
Sass变量命名应以可维护性优先,采用$color-blue-500、$space-md等带层级和单位的格式;嵌套不超过三层,超层用BEM平铺;mixins所有非核心参数须设默认值;全项目统一使用@use,禁用@import混用。
-
在Safari中用appearance:none移除checkbox默认样式可行,但必须搭配::before或::after伪元素重绘且显式设置display:block(或inline-block),否则伪元素不渲染——这是Safari独有的坑。
-
Chrome/Edge按Ctrl+P导出PDF排版错乱,根本原因是浏览器默认禁用position:fixed、transform等CSS,忽略非@mediaprint规则并强制分页;须显式添加@mediaprint重置样式、禁用浮动定位、避免vh/vw单位、启用print-color-adjust精确打印背景,SVG/CSS建议转PNG嵌入。
-
关键在于闭包是否意外延长本该即死对象的寿命,尤其当注册为事件监听器、缓存在长生命周期对象中或捕获大尺寸上下文时;需结合GC日志、内存分配追踪与堆快照差异定位高危闭包。
-
纯CSS无法实现数字动态滚动,必须用JavaScript配合requestAnimationFrame控制数值演进,结合IntersectionObserver触发及正则提取纯数字,确保平滑、精准、低开销。
-
border-radius:50%不圆的根本原因是元素宽高不相等;object-fit:cover裁边填满容器,适合头像,contain则保持原图比例留白。
-
HTML无法直接获取Wi-Fi或蜂窝信号强度,需依赖JavaScript调用navigator.connection等API间接判断网络质量,仅支持effectiveType和downlink,不提供dBm或格数。
-
最基础的预览方式是双击打开HTML文件,但fetch、ES模块等需本地服务器;常见问题包括保存为.txt、编码非UTF-8无BOM、file://协议限制;推荐LiveServer或http-server;开发者工具中Network和Console优先排查路径与报错。
-
performance.measure的两个参数必须都已存在,否则静默失败;常见漏打场景包括快速连点、钩子中DOM未就绪、路由跳转mark覆盖;验证需用console.assert检查mark是否存在;“渲染完成”应检测真实DOM内容或LCP,而非仅依赖生命周期钩子;上报须节流、抽样、清理。
-
<link>必须放在<head>中,因浏览器流式解析HTML时若将其置于<body>会导致FOUC(无样式内容闪烁)、样式延迟应用甚至不生效,且路径错误、编码BOM等问题也会导致链接失败。