`all: unset` 与 `all: revert`：什么时候应该使用它们？

CSS 的细微差别：all: unset 与 all: revert

了解 CSS 关键字之间的微妙之处可以提升您的造型能力。在 all: unset 和 all: revert 的情况下，区别在于它们对浏览器应用的样式表和用户定义的样式表的处理。

all: unset

As MDN 中指出，unset 使您能够将属性重置为其继承值（如果从其父级继承）或重置为其初始值（如果不是从其父级继承）。因此，它模拟前一种情况中的继承关键字和后一种情况中的初始关键字。

all: revert

相反，revert 将属性的级联值恢复为其状态没有对当前元素进行任何修改。这意味着它将属性重置为其继承值，或者如果不存在，则重置为浏览器样式表或任何适用的用户样式设置的默认值。

主要差异

当浏览器将默认样式应用于元素时，就会出现主要区别。使用恢复可以有效地撤消这些样式，而取消设置则不能。

插图

考虑以下 HTML 和 CSS 代码片段：

<p></p>

假设浏览器自动将

的默认边距设置为50px元素。在这种情况下，带有 margin:revert 的段落中的文本将其边距重置为 0px，从而有效地删除浏览器的默认样式。另一方面，带有 margin:unset 的段落内的文本将保留浏览器的默认边距 50px。

以上是`all: unset` 与 `all: revert`：什么时候应该使用它们？的详细内容。更多信息请关注PHP中文网其他相关文章！