all: unset 在旧版 WebKit(如 Safari 14.0 及更早)中部分支持:可继承属性设为 inherit,非继承属性设为 initial,但不重置 UA 样式表定义的默认值(如 button 边框、input 焦点轮廓),且不支持伪元素渲染通道。

all: unset 在旧版 WebKit(如 Safari
旧版 WebKit(包括 Safari 13.x 及更早、iOS 13.x WebView、macOS Catalina 自带 Safari)不支持 all 属性本身,也不识别 unset 关键字。遇到 all: unset,整条声明被静默丢弃——既不报错,也不 fallback,连部分生效的机会都没有。这和 IE 的行为一致,但很多人误以为“WebKit 至少支持 unset”,其实不是:unset 单独用于单个属性(如 color: unset)在 Safari 6.1+ 就已支持,但 all: unset 是另一回事,它依赖对 all 属性的实现,而该实现直到 Safari 14.1 才落地。
为什么 @supports (all: unset) 在旧版 WebKit 中无效
@supports 规则本身在 Safari 9+ 才支持,但即便如此,@supports (all: unset) 仍会返回 false 或直接跳过检测逻辑,因为:旧版引擎根本不把 all 当作合法属性名,语法解析阶段就忽略整条声明;unset 在 all 上下文里不参与单独校验。所以你不能靠它做特性检测来写降级规则——写了也白写。
手动重置时必须显式覆盖 display 和 box-sizing
旧版 WebKit 对 all: unset 的缺失,导致开发者容易忽略两个高危副作用:一是 display 会退回到 initial(即 inline),让 <div>、<code><section></section> 塌缩;二是 box-sizing 回到 content-box,破坏你写的 width + padding 布局预期。这些不是“没清干净”,而是 all: unset 本就会这么干,只是旧版浏览器让你看不到它原本想干的事。
-
display: block或按需设为flex/grid,不能依赖继承 -
box-sizing: border-box必须显式声明,且建议通过* { box-sizing: border-box }全局兜底 -
margin: 0和padding: 0要写死,别用margin: initial(旧版 WebKit 不认) -
border: none是唯一兼容写法,border: initial在 Safari 12-13 中表现不一致
all: revert 是更优替代,但需确认 Safari 版本
all: revert 在 Safari 14.1+、Chrome 93+、Firefox 95+ 中能真正还原 UA 默认样式(比如按钮边框、输入框 focus outline、<del></del> 的删除线),比 all: unset 更贴近“重置后仍可用”的目标。但它在 Safari 14.0 及更早完全不支持,且 Android WebView(尤其 Android 10 及更早)同样跳过解析。如果你的兼容底线是 Safari 13,那就别用 all: revert —— 它不会 fallback,只会静默失效。
立即学习“前端免费学习笔记(深入)”;
真正麻烦的从来不是语法怎么写,而是你得明确:这个元素需要的是“回归规范初始值”,还是“回归浏览器默认可用状态”。all: unset 只执行前者,且在旧版 WebKit 中连执行机会都没有。


















