-
用父容器scaleX(-1)翻转，子元素再scaleX(-1)抵消即可保持文字正常；该方法不影响布局、事件和顺序，比rotateY(180deg)更轻量兼容。
-
使用Vim插件UltiSnips和vim-snippets可大幅提升HTML/CSS编码效率。首先通过Plug安装插件并在.vimrc中配置，接着在~/.vim/after/snippets/目录下创建html.snippets和css.snippets文件，分别定义html5和flex等常用代码片段。输入缩写如html5或flex后按Tab键即可展开为完整代码结构。此外，vim-snippets自带丰富内置片段，如form、ul>li*3和anim等，支持快速生成表单、列表和动画模板，显著减少重复
-
<optgroup>是唯一原生、语义正确且无障碍友好的下拉分组方式，但必须有非空label、直接嵌套于<select>内、禁用仅作用于选项而非标题，且不参与表单提交。
-
可选链操作符（?.）适用于访问深层嵌套属性、调用可能不存在的方法、访问数组元素，需与??搭配设默认值；不支持赋值、delete、new及私有字段；ES2020特性，可用Babel降级。
-
使用Flexbox或绝对定位+transform可实现弹窗居中。1.Flexbox：父容器设为flex，用justify-content和align-items居中，无需知悉子元素尺寸；2.绝对定位：元素top和left设50%，再用transform位移-50%实现精准居中。推荐使用Flexbox，更简洁现代，兼容性需求高时选绝对定位。
-
ID选择器优先级高于类选择器，因CSS权重按四元组(内联,ID,类/伪类/属性,标签/伪元素)逐位比较，ID存在时第二位为1必胜；调试应查隐藏ID，避免滥用!important。
-
rgba()不支持CSS变量是因语法限制，正确方案为：①hsl()斜杠语法；②color-mix()混合；③JS动态拼接。需注意opacity与backdrop-filter的干扰及alpha精度问题。
-
该问题本质是异步属性覆盖、迭代器辅助逻辑未适配、属性查找性能劣化三者叠加导致的设计失衡；核心在于子类用实例属性覆盖父类异步属性后，未同步更新迭代器助手的访问路径，引发冗余判断、重复await或缓存失效。
-
:root不是html的别名，因为它始终指向文档逻辑根元素（HTML中为html，XML/SVG中为对应根节点），语义更准确、跨环境更可靠；在ShadowDOM、iframe或WebComponents中，:root能穿透作用域而html不能。
-
Vue.js中通过slots与CSS变量配合实现结构与样式分离：slots提供内容灵活性（默认、具名、作用域插槽），CSS变量承接主题配置（语义化命名、默认回退值），组合使用可复用组件并自由定制外观，无需修改源码或添加scopedclass。
-
fixed定位适合做真正“不随滚动移动”的全局UI元素，其基准是视口，脱离文档流且不受父容器transform等影响，但需注意iOS软键盘错位、AndroidWebView异常及overflow裁剪失效等问题。
-
canvas.toDataURL()返回空白是因为图像未加载完成或跨域未配置；需确保img.onload后绘制且设置img.crossOrigin='anonymous'；toDataURL()返回base64，像素操作应改用getImageData/putImageData。
-
aria-live="polite"在当前播报结束后读新内容，适合通知类更新；aria-live="assertive"立即中断播报，仅用于紧急提示。需确保区域初始可见、已挂载DOM，并配合append或insertAdjacentHTML控制只读新增内容。
-
HTML表单autocomplete是浏览器提示而非强制指令，仅用标准值如current-password、new-password等才有效，off在现代浏览器中基本失效，on冗余无作用，填充依赖name/type/autocomplete组合且需表单包裹。
-
宏任务执行顺序由入队时间决定而非类型优先级；定时器、DOM事件、网络请求回调触发机制不同，需避免长任务阻塞，合理使用微任务、防抖、节流及并发控制优化响应性能。
