-
:host无法直接继承:root的CSS变量，因ShadowDOM样式隔离导致作用域断开；需在:host中用--var:inherit显式承接，slot内容则需外层容器设all:inherit才能继承。
-
z-index生效需元素创建层叠上下文，即非static定位且父级未用transform/opacity/filter等截断；fixed元素被遮挡常因body/html的overflow或transform所致；动画需显式初始状态。
-
对象字面量简写可压缩低代码平台中自定义异步逻辑的生命周期代理代码：用方法简写替代function、计算属性名动态挂载钩子、解构+箭头函数代理异步调用、结合defineAsyncComponent实现懒加载。
-
HTML表单autocomplete是浏览器提示而非强制指令，仅用标准值如current-password、new-password等才有效，off在现代浏览器中基本失效，on冗余无作用，填充依赖name/type/autocomplete组合且需表单包裹。
-
关键是在submit事件中用querySelector按name或id定位input并取.value，需preventDefault防止刷新，值为字符串需手动转换类型。
-
首图更快下载的关键是避免被降级：浏览器默认将所有<img>设为Medium优先级，需用fetchpriority="high"（Chromium112+）或<linkrel="preload"as="image">主动声明其关键性，确保显示Highest优先级，而非盲目提速。
-
亚像素缝隙源于margin/top等布局属性在计算中被四舍五入，而transform属合成层操作，可保留0.1px级精度，真正实现像素对齐。
-
图片溢出多列容器的主因是原始尺寸超列宽且未自动缩放，解决关键是设max-width:100%并配合height:auto保持比例；再用object-fit（如cover或contain）控制显示效果，同时确保父容器支持流式布局且无干扰属性。
-
透明度和渐变通过opacity、rgba及linear-gradient等CSS属性提升网页视觉层次，opacity控制整体透明，rgba实现背景透明不影响文字，linear-gradient和radial-gradient创建色彩过渡效果，合理搭配可增强界面现代感与空间感。
-
响应式图片技术通过srcset和sizes属性让浏览器根据设备屏幕特性自动选择最适配图片；配合picture元素可按设备类型与分辨率双重适配；推荐按宽度命名并用构建工具自动生成多尺寸版本。
-
<p>box-sizing:border-box能防止元素撑破容器，因其使width包含padding和border，避免总宽超限；现代浏览器均支持，建议全局重置*{box-sizing:border-box;}。</p>
-
大多数现代浏览器对localStorage的单域名存储上限是5MB，但SafariiOS曾限2.5MB，macOSSafari17+升至5MB；超限时抛出QuotaExceededError，需try...catch捕获；无预检接口，须用TextEncoder估算UTF-8字节长度；大容量应选IndexedDB或CacheAPI。
-
按钮组合的本质是布局约束与状态隔离，需通过flex/grid容器、position:relative包裹、gap替代margin、同步控制pointer-events与tabindex等实现可靠交互与可访问性。
-
:nth-child(odd)不生效的根本原因是它按父元素下所有同级子元素的物理位置计数，而非仅目标标签；混入thead、div等干扰节点会导致序号错乱，应改用:nth-of-type(odd)或限定tbody作用域。
-
watch本身不负责持久化，需配合localStorage等实现自动同步表单：监听字段变化、防抖写入、JSON安全序列化、页面加载时恢复、支持手动清除及敏感字段控制。
