all

版本：CSS3

all属性实际上是所有CSS属性的缩写，表示所有的CSS属性。CSSall简写属性将除却unicode-bidi与direction之外的所有属性重设至其初始值，或继承值。

示例

/* global values */
all: initial
all: inherit
all: unset

/* css cascading and inheritance level 4 */
all: revert;

浏览器支持

语法

all属性is specified as one of the CSS 全局 keyword values. Note that none of these values affect theunicode-bidi与direction这两个属性。

取值

• initial该关键字代表改变该元素或其父元素的所有属性至初始值。
• inherit该关键字代表改变该元素或其父元素的所有属性的值至他们的父元素属性的值。inherited values
• unset该关键字代表如果该元素的属性的值是可继承的，则改变该元素或该元素的父元素的所有属性的值为他们父元素的属性值，反之则改变为初始值。
• revert指定依赖于声明所属的样式表原点的行为：
  • User-agent origin：相当于unset
  • User origin：将层叠回滚到用户代理级别，以便计算指定的值，就好像没有为该元素指定作者级别或用户级别规则。
  • Author origin：将层叠回滚到用户级别，以便计算指定的值，就好像没有为元素指定作者级规则。出于revert的目的，“作者”原点包括“覆盖”和“动画”原点。

示例

HTML

 lorem ipsum dolor sit amet, consectetur adipiscing elit.

phasellus eget velit sagittis.

CSS

body {
  font-size: small;
  background-color: #f0f0f0;
  color: blue;
}

blockquote {
  background-color: skyblue;
  color: red;
}

结果

没有all属性

lorem ipsum dolor sit amet, consectetur adipiscing elit. phasellus eget velit sagittis.

body { font-size: small; background-color: #f0f0f0; color:blue;  color: red; }

使用浏览器默认样式，以及另外的定义的背景色与文字颜色。它是一个 block 元素：它之后的文字位于它的下方。

all:unset

lorem ipsum dolor sit amet, consectetur adipiscing elit. phasellus eget velit sagittis.

body { font-size: small; background-color: #f0f0f0; color:blue;  color: red; }
blockquote { all: unset; }

没有使用浏览器默认样式：它现在是一个 inline 元素(初始值)，其background-color为transparent(初始值)，但其font-size仍为small(继承值)，其color为blue(继承值)。

all:initial

lorem ipsum dolor sit amet, consectetur adipiscing elit. phasellus eget velit sagittis.

body { font-size: small; background-color: #f0f0f0; color:blue;  color: red; }
blockquote { all: initial; }

没有使用浏览器默认样式：它现在是一个 inline 元素(初始值)，其background-color为transparent(初始值)，其font-size为normal(初始值)，其color为black(初始值)。

all:inherit

lorem ipsum dolor sit amet, consectetur adipiscing elit. phasellus eget velit sagittis.

body { font-size: small; background-color: #f0f0f0; color:blue; }
blockquote { background-color: skyblue; color: red; }
blockquote { all: inherit; }

没有使用浏览器默认样式：它现在是一个 block 元素（继承自其父元素），其background-color为transparent(继承值)，其font-size为small(继承值)，其color为blue(继承值)。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com