写了这么多年 CSS，initial 和 inherit 以及 unset 和 revert 还傻傻分不清楚？ (2)

可能有点绕，我们通过一个实际的 DEMO 看看 unset 和 revert 的异同：

<div> <b>设置了 unset，我的 font-weight 会被完全清除</b> <br> <b>设置了 revert，我的 font-weight 将会被还原到浏览器默认样式的 font-weight: bold;</b> </div> .unset { font-weight: unset; } .revert { font-weight: revert; }

当然，这里有个前提，我当前测试的浏览器（Chrome 92.0.4515.107）对 <b> 标签，有设置默认的浏览器用户代理样式，会对它进行加粗处理：

上面的代码实际效果：

CodePen Demo -- Difference between revert and unset keyword in CSS

总结一下，了解 CSS 样式的 initial（默认）和 inherit（继承）以及更为新的 unset 和 revert 是熟练使用 CSS 的关键。

虽然有点绕，但是熟练掌握之后，在很多小地方都有着妙用，灵活使用让你的代码更加精简。