-
HTML无法直接扫码，需用JavaScript调用摄像头：通过navigator.mediaDevices.getUserMedia获取视频流，用jsQR等库逐帧解码二维码；须控制帧率、适配分辨率、及时关闭媒体轨道，并确保HTTPS环境与权限处理。
-
auto-fit只创建有内容的轨道并拉伸填满容器，auto-fill则无论内容多少都按minmax()尽可能预留全部轨道，导致空列和布局错位。
-
正确引用外部CSS需根据HTML与CSS文件的相对位置使用路径。同一目录用href="style.css"，子目录用href="css/style.css"，上级目录用href="../style.css"，多级跳转如href="../../assets/css/main.css"；注意大小写敏感、使用正斜杠/、避免以/开头导致根路径误用，并通过开发者工具Network面板验证加载情况。
-
shortcuts字段必须是顶层非空数组，每项须含name和url（相对路径），且url需符合scope范围；Android要求显式配置icons，否则显示空白。
-
根本原因是移动端浏览器地址栏收放导致vh动态变化，应改用min-height:100vh+height:100%、JS同步--vh变量、监听resize/orientationchange事件并防抖处理，确保全屏体验稳定。
-
JIT优化不是“一劳永逸”因为其依赖的运行时推测信息可能失效，一旦假设被违反（如类型变化、类加载、虚方法目标变更等），必须执行去优化（deoptimization）回退到解释执行。
-
font-display:swap需配合preload、font-size-adjust和min-height容器兜底才能缓解移动端CLS，单独使用反而加剧布局跳动。
-
优先用grid-column和grid-row手动控制每个格子的起止线；grid-template-areas仅适用于语义固定、命名稳定的布局场景。
-
画中画标题样式受限，只能通过video::picture-in-picture-title伪类调整color和font-family等极少数属性；1.浏览器限制样式是为了安全，防止伪造系统界面进行钓鱼等恶意行为；2.保持用户体验一致性，确保PiP窗口在不同网站间外观统一、易于识别和操作；3.技术上因PiP窗口由浏览器原生UI层渲染，网页CSS控制能力本就有限；4.标题内容应通过<video>标签的title属性设置，以确保清晰传达视频信息；5.优化PiP体验可从提升视频质量、优化title文案
-
构建高性能业务流模块系统应以ES6模块静态导出为核心：用命名导出封装细粒度异步单元，export*聚合领域能力，default导出组合流程模板，配合dynamicimport实现按需加载。
-
正确使用HTML标签和属性实现图片语义化布局，可提升可访问性、SEO与代码维护性。1.内容型图片用<img>配alt描述，如产品图；2.装饰性图片通过CSSbackground-image实现；3.复杂图表结合aria-describedby或figure与figcaption提供详细说明；4.响应式中利用srcset、sizes优化加载，配合loading="lazy"提升性能；5.优先使用WebP等现代格式并通过<picture>回退；6.alt文本需具体简
-
不能用opacity设置背景透明，因为它会作用于整个元素及所有子元素，导致文字、边框、图标等同步变淡甚至叠加衰减；应使用background-color:rgba()仅控制背景色透明度，保持内容清晰可读。
-
div只是无语义、无默认样式、不自动撑开或居中的空块级容器；需手动设置width/height/margin/flex等CSS才能实现布局效果，语义化标签优先，嵌套宜浅。
-
直接用::after伪元素比overflow:hidden更可靠，因后者会意外裁剪绝对定位子元素、遮挡阴影或干扰动画，而伪元素仅作用于浮动上下文；IE8+兼容的.clearfix混合器需用单冒号、content:""、display:table及clear:both。
-
ChromeDevToolsCoverage面板仅统计实际加载执行的JS/CSS资源，不统计HTML文件本身；内联脚本/样式计入覆盖率，但HTML中的未触发资源（如hidden元素内联代码、懒加载脚本）不会被覆盖，需手动模拟全用户路径操作以提升统计准确性。
