CSS all 属性与全局关键字 initial、inherit、unset、revert

CSS all 属性与全局关键字 initial、inherit、unset、revert

一、背景

在书写CSS的时候,经常遇到inherit等关键字,为了搞清楚相关的关键字,记录一下收集资料和 Demo。

二、all 属性

all 将除了 unicode-bidi direction 之外的所有属性重设至其初始值,或继承值。

initial 关键字

initial 会把浏览器内置的CSS也全部变成初始值。比如将所有元素的 display 初始化为 inlineborder初始化为 nonebackground 初始化为 nonecolor 初始化为 black

.title {
    all:initial; //
}
复制代码

inherit 关键字

inherit 继承父元素的属性值,它可以应用于任何 CSS 属性。

unset 关键字

unset 将默认继承元素(如 color)继承其父元素属性值(如果父元素属性未定义则设为初始值。),将非默认继承元素设为初始值。

revert 关键字

revert 将元素的属性值设为浏览器默认样式,注意区别于初始值。

三、 Demo

四、兼容性

除了revert属性值从 chrome84 开始支持外,其他属性值的兼容性都不错。

image.png

image.png

分类:
前端
标签: