:default伪类仅在初始渲染时匹配HTML中显式声明selected/checked的元素，不响应JS动态变更，且Safari对option:default支持滞后。
`:default` 伪类只对 `
它不是通用“默认值”检测器，不能用于 `` 的 value 属性、defaultValue 属性，也不能判断 JS 动态设置的选中状态。浏览器只在元素**初始渲染时**根据 HTML 中的 selected、checked 属性（或第一个 <option>）决定谁是 default。
-
<select>中只有带selected的<option>才匹配:default；没写selected时，**第一个<option>不自动成为 :default**（除非显式标记） -
<input type="radio">必须有checked属性才触发:default；JS 设置checked = true不会激活该伪类 -
<input type="checkbox">同理：仅 HTML 中的checked属性有效，且多个 checkbox 可同时匹配:default（只要它们都带该属性）
Chrome/Firefox 支持良好，但 Safari 15.4 之前不支持 `
如果你用 select option:default 做样式高亮，默认选项在旧版 Safari 里完全没反应。Radio/checkbox 的 :default 在 Safari 全版本都支持，但 <option> 的支持晚了两年多。
- 检查兼容性时重点看
option:default—— 它才是跨浏览器风险点 - 替代方案不是 JS 模拟，而是退回到
option[selected]属性选择器（但注意：它只匹配写了selected的，不包含隐式首个项） - 不要依赖
:default做功能逻辑（比如表单校验），它纯属 CSS 渲染层特性
和 :checked 的关键区别：不可被 JS 动态改变
:default 是静态快照，:checked 是实时状态。用户点击后，:checked 立刻更新，:default 一动不动。
- 示例：
<input type="radio" name="x" value="a" checked></input>→ 初始时两者都匹配；用户切到 value="b" 后，:checked移向新元素，:default仍死守原地 - 这意味着你不能用
:default来“反向识别当前选中项”，它只回答“谁最初被设为默认” - 想高亮“当前选中”，用
:checked；想高亮“原始默认项”，才用:default
`:default` 不触发重排，但滥用可能误导维护者
它本身性能无负担，问题出在语义混淆。有人以为加了 :default 就等于“这个选项有默认值”，结果发现没写 selected 就不生效，或者改了 HTML 却忘了同步样式规则。
立即学习“前端免费学习笔记（深入）”；
- 真实项目中，更稳妥的做法是：显式加
selected/checked属性 + 用属性选择器[selected]或[checked]控制样式 - 如果坚持用
:default，务必在 HTML 里写明selected或checked，别指望浏览器自动推断 - 团队协作时，最好在 CSS 注释里写清：“此样式仅响应初始 default 状态，不随 JS 操作变化”
:default 当成“当前默认值”的实时指示器——它从来就不是。 
