-
使用@keyframes定义动画关键帧，通过transform的scale()和rotate()组合实现图片缩放旋转，再用animation属性应用到图片，可设置时长、缓动、循环等参数，配合:hover还可触发悬停动画，注意transform需统一声明避免覆盖。268 收藏 -
全选checkbox失效主因是事件绑定时机不当、子项状态变更未同步更新全选框、动态添加商品未用事件委托及DOM与数据不同步；需确保DOM加载完成再绑定、双向监听、事件委托及数据状态同步。414 收藏 -
用CSS变量+clamp()+border-radius组合才能真正统一平滑控制响应式卡片圆角；硬写像素或仅用Bootstrap类易致小屏露白边、大屏显生硬。405 收藏 -
favicon是浏览器标签页等位置显示的小图标，必须添加以避免404请求和警告；最简方式是将favicon.ico放根目录并在head中用<linkrel="icon"href="/favicon.ico"type="image/x-icon">引入。277 收藏 -
HTML标签嵌套合法性必须依赖HTML5规范解析器验证，而非肉眼、正则或AutoCloseTag/Emmet等插件；推荐使用W3Cvalidator或html-validate工具，确保DOCTYPE和charset声明正确以避免怪异模式导致校验失准。276 收藏 -
:focus-within不能直接实现“点击任意处关闭弹窗”，因为它仅响应焦点进出，不监听点击事件或鼠标位置；其关闭效果实为焦点流失所致，且在Firefox中存在兼容性问题，无法可靠响应空白区域点击。265 收藏 -
2026年前端架构师晋升核心是决策颗粒度与可验证性：需将技术选型转化为可度量业务结果，以连接层能力复盘，绑定三年演进预案完成度，并构建人机校验闭环及反事实推演。490 收藏 -
<main>标签必须且只能出现一次，是强制规范而非建议，用于确保屏幕阅读器和键盘用户能准确定位页面唯一核心内容，缺失或错误使用将导致无障碍访问严重受损。283 收藏 -
output标签需显式绑定+事件触发才更新，无自动响应机制；必须设for属性且ID匹配，用value属性更新，不参与表单提交，移动端Safari兼容性差。101 收藏 -
遮罩层不必z-index更高，但需与弹层同属一个堆叠上下文；常见失效原因是父元素position/transform创建了新上下文，导致z-index局部生效；最优解是将遮罩层和弹层均挂载到body下。212 收藏 -
使用CSStransition实现响应式卡片动画，通过设置transform、box-shadow等属性的平滑过渡，并结合媒体查询适配不同设备，提升交互体验。375 收藏 -
初次加载transition闪动是因首帧未预热合成层，需用transform:translateZ(0)提前触发硬件加速，并确保backface-visibility:hidden在其后声明，且避免display:none销毁图层。237 收藏 -
通过展开运算符实现多层嵌套对象的非破坏性局部更新，需逐层展开、只改目标路径、保持其余结构不变，如更新user.profile.settings.theme需四层展开；函数封装（如updateIn）可提升可读性与复用性；含数组时需结合map与展开；严禁覆盖整层或直接赋值等破坏性写法。284 收藏 -
Object.assign仅拷贝属性当前值，不复制getter/setter等描述符，导致访问器逻辑丢失；需用Object.defineProperty或Proxy等显式保留行为。219 收藏 -
HTMLPWA与原生App是平行技术路径，无法自动兼容或打通；ServiceWorker仅作用于WebView内请求，不劫持原生网络栈，需桥接实现缓存共享与权限调用。208 收藏
