css 全局关键字属性

inherit 继承关键字

这是一个从IE8就开始支持的关键词，用于继承上层的样式效果，比如字体大小，字体颜色等，也是用的比较多的一个关键词，这里就不多说。

initial 初始值关键词

initial可以把css的属性还原成css语法中规定的初始值，但是需要注意的是这里的初始的值不是元素默认的值，而是css语法规范中定义的初始值。

p {
  display: initial;
}

p元素默认是block盒子，但是当我们使用initial时你会发现它变成了一个inline盒子了，所以不要搞混了这个关键词的作用。

unset 不固定值关键词

如果当前使用的css属性是具有继承特性的，unset就等同于inherit，如果当前使用的css属性是没有继承特性的，则等同于initial。

除了IE不兼容，其他的浏览器在早期阶段就已经完全兼容了，所以兼容性还是不错的。

这个属性特别适合用来重置一些全局性的元素，配合all属性。

就拿html5.1中新增的dialog元素来说，它默认会有边框，会有内边距等等一些预设样式，但是如果我们想要使用的时候，可能大部分的预设样式我们是不需要的，为此就不得不通过css覆盖进行样式重置，如果有20个样式，你就得写20个css进行重置，非常麻烦，此时我们就可以使用all: unset; 实现快速重置。

dialog {
  all: unset;
}

revert 重置关键词

revert才是实至名归的重置关键词，它可以将当前元素的样式重置还原成浏览器默认的内置样式，但是唯一美中不足的是firefox和chrome支持的比较晚，firefox 67开始才支持，chrome 84才支持，安卓4.4之后才支持。

如果你的项目适配的目标群体不是太老的，这个属性用起来还是很快乐的。

比较常见的一个场景是：

项目在开发初期写了一个reset.scss文件用于重置默认元素样式，但是里面很有可能会这么写：

ul,ol {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

这么写会产生一个问题，假如有一天我们需要原生的ul或者ol的样式效果，此时由于重置了样式，导致我们不得不手动去单独再写一份样式来覆盖重置样式。

ul.list {
  padding: 0 0 0 40px;
  list-style-type: outside;
}

如果我们明确知道默认样式的情况下我们确实可以这么写，假设我们不支持默认值，那就只能去查文档了，非常麻烦，为此我们直接使用revert关键词就能实现这个效果。

ul.list {
  padding: revert;
  list-style-type: revert;
}

省时省力。

补充 all

上面我们使用了all这个css属性，all属性可以泛指除了unicode-bidi、direction以及css自定义属性以外的所有css属性。

为此可以用它来快速重置元素的样式。

而unicode-bidi、direction排除，是因为在css定义初期是没有考虑不同国家的文字的排版方向的，所以它们的默认效果都是从左到右，如果使用all再配合initial进行重置，就会导致阿拉伯文的从右到左排版发生变化，显然这种变化是不对的，所以基于历史原因，这些css属性是不包含在all中的。