-
掌握CSS中transition与z-index协同技巧，可避免动画卡顿和层级错乱。1.z-index仅对定位元素生效，动画前应提前设置高z-index，且不在transition中包含z-index变化；2.确保动画元素所在父容器具备独立堆叠上下文，必要时通过transform:translateZ(0)等方式创建新层；3.模态框显示时先设z-index和visibility，再触发动画，隐藏时反向操作；4.卡片悬停提升层级时，hover前预设z-index目标值，配合transform实现跃出效果。关
-
选defer还是async取决于脚本是否依赖DOM或其他脚本：defer等HTML解析完按序执行，适合操作DOM或有依赖的外部脚本；async下载完立即执行、无序，适合独立第三方脚本；默认同步加载会阻塞渲染，应避免。
-
使用flex-wrap和gap可创建响应式按钮组：通过display:flex、flex-wrap:wrap实现换行，gap统一间距，无需媒体查询即可在不同屏幕下自动调整布局。
-
text-emphasis属性通过添加强调标记为文本提供非侵入性视觉提示。1.它由text-emphasis-style和text-emphasis-color组成，支持dot、circle等样式或自定义字符；2.适用于数据校验、术语标注、内容审核等场景，不干扰文本原有样式；3.浏览器兼容性较好，现代浏览器普遍支持，IE需降级处理；4.存在西文排版冲突、样式灵活性不足及可访问性限制，需结合line-height调整、伪元素或语义化HTML应对。
-
ITCSS六层顺序不可调换，因决定CSS加载与权重优先级：settings/tools最前（变量/函数），generic次之（全局重置），objects/components居中（布局/组件），trumps垫底（工具类）；@import或@use必须严格按层归类导入，objects与components需分离结构与视觉职责，trumps禁用语义名且仅含单一行为样式。
-
事件委托通过在父元素绑定单个监听器替代为大量子元素分别绑定，显著减少内存占用；它依赖事件冒泡和closest()精准定位目标元素，适用于动态列表等场景，但不适用于少量静态元素或需精细控制监听器生命周期的情况。
-
直接用color即可控制图标字体颜色，因其本质是特殊字符；需确保字体加载、类名正确及CSS优先级合理，推荐使用currentColor实现颜色同步，状态样式应结合伪类或属性选择器控制。
-
复制代码缩进混乱是因换行符（CRLF/LF）和制表符（Tab/空格）在编辑器间不兼容，需统一换行符为CRLF、确认Tab宽度、避免鼠标拖选引入零宽字符。
-
JavaScript中的class静态方法通过static关键字定义，直接绑定到类上，通过类名调用。使用场景包括：1.类级别的工具方法，如数学运算；2.工厂方法，用于创建实例；3.类级别的配置管理。使用时需注意不能访问实例属性，避免命名冲突，并考虑测试和调试的复杂性。
-
HTML5的<audio>标签支持嵌入本地或网络音频，可通过src属性引入文件、controls显示控件、preload预加载；需注意CORS限制；可用JavaScript编程控制播放；推荐多source回退写法提升格式兼容性。
-
本文详解ReactRouterv6中Navigate组件的正确用法，解决因误用<Routeto="..."/>导致白屏及Cannotdestructureproperty'loggedIn'of'user'asitisnull等典型错误，并提供状态派生、条件渲染与路由守卫的完整解决方案。
-
HTML5GeolocationAPI依赖底层系统且需HTTPS/localhost环境；失败主因是权限拒绝、定位服务关闭或超时未设；须完整处理error回调并适配坐标系与设备兼容性。
-
使用gap配合flex-wrap可优化弹性布局间距，避免传统margin导致的错乱问题。gap能自动控制项目间行与列距，统一管理响应式间隙，且不产生首尾多余空白，适用于卡片网格、表单组等多行布局场景。主流浏览器已支持，旧版本可通过@supports降级处理。结构更清晰，维护更简便。
-
JavaScript原型链是对象通过[[Prototype]]链接逐级向上查找属性和方法的继承机制；普通对象、数组、函数的原型最终都指向Object.prototype，其[[Prototype]]为null；构造函数的prototype指定实例原型，__proto__指向直接原型；属性查找沿__proto__链进行直至null；主流继承方式包括组合继承、寄生组合继承和ES6class，均基于原型链实现。
-
max()函数可从多个值中选取最大值用于字体大小，实现响应式文本。例如font-size:max(1rem,1.5vw)在小屏用1rem，大屏随视口放大；相比clamp()仅设下限无上限，适合无需严格限制字体上限的场景，主流浏览器已支持，旧版可加降级方案兼容。
