-
Chrome中mask-image需同时声明-webkit-mask-image和mask-image，仅写标准属性会失效；值须为url()或渐变；SVG遮罩要避免viewBox冲突；mask-position动画需加transition且用坐标值；mask-size须与background-size匹配；Firefox不支持该属性，需用clip-path或canvas降级。
-
必须同时设置background-origin:content-box和background-clip:content-box才能使背景严格限制在内容区；前者控制定位原点，后者控制渲染范围，二者缺一不可。
-
loading="lazy"仅适用于img和iframe且需src属性，Chrome76+、Firefox75+、Edge79+及Safari15.4+（仅img）支持；首屏图、背景图、picture内source等不适用，须配合width/height防CLS，SSR中需注意JS加载时机。
-
Group-hover为什么必须配合group类使用直接写group-hover:xxx没效果，是因为Tailwind的group-hover是一个“依赖类”——它只在父元素有group类时才生效。没有group，group-hover根本不会被编译进CSS。错误写法：文字→完全无效正确结构：文字group必须加在触发hover的祖先容器上（不一定是直接父级，但必须是DOM上层）子元素hover状态下修改父级以外的兄弟元素常见需求：鼠标悬停在
-
浏览器原生支持空格键暂停媒体，但需视频/音频元素获得焦点；添加tabindex="0"使其可聚焦，配合aria-label提供无障碍提示，禁用原生控件不影响快捷键，无标准API可彻底禁用。
-
max-w-7xl是Tailwind中对应1280px的最大宽度类（lg+生效），非撑满全屏，旨在提升长文阅读体验；必须与mx-auto配合实现居中，且需注意容器上下文与自定义配置方式。
-
登录页面需构建语义化HTML表单，添加HTML5验证属性，通过CSS美化样式，集成JavaScript实现密码可见切换与防重复提交，并配置aria标签等无障碍支持。
-
根本原因是类名层级未真正解耦，BEM要求样式严格基于单个类名匹配、禁用结构选择器与动态拼接，需统一修饰符前缀、硬编码类名、避免CSSModules破坏可读性，并通过工具校验和协作对齐保障体系落地。
-
适合批量更新元素内容的DOM方法是textContent、setAttribute()和DocumentFragment；单个文本用textContent，批量插入用DocumentFragment避免重排重绘。
-
箭头函数没有自己的this绑定，不支持new调用、arguments对象和yield关键字，适用于无需独立this的短小回调场景。
-
本文介绍在严格模式下安全、可靠地获取当前执行函数名的多种方法，包括原生Error.stack解析优化方案和成熟第三方库stacktrace-js的使用技巧，并附带性能对比与最佳实践建议。
-
HTML图片对齐不应使用已废弃的align属性，而应采用CSS的float、text-align、flex等现代方案；Dreamweaver中需通过CSS面板手动设置，设计视图可能不实时渲染，须用实时视图或浏览器预览验证。
-
利用CSS自定义属性可高效实现主题切换，通过:root定义变量（如--color-bg）、var()调用、JavaScript切换类名（如theme-dark）重写变量值，并结合prefers-color-scheme适配系统偏好，提升用户体验。
-
WebWorker是浏览器中实现JavaScript多线程的唯一标准机制，通过异步消息传递通信，运行于独立上下文，不支持DOM、window等API，需遵循结构化克隆、同源限制、显式错误处理等规范。
-
必须按LVHA顺序声明a标签伪类：:link→:visited→:hover→:active；:visited仅支持color、background-color等有限样式，且不可被JS读取或通过!important绕过安全限制。
