CSS继承和初始有什么区别？

Question

CSS 之间inherit和initialCSS 的区别究竟是什么？对我来说,他们总是一样,例如:

a.no-style{color: inherit}

会做同样的事情

a.no-style{color: initial}

Answer 1

每个CSS属性的定义摘要中给出的初始值对于继承和非继承属性具有不同的含义.

对于继承的属性,当没有为元素指定值时,仅对根元素使用初始值.

对于非继承属性,当没有为元素指定值时,将为任何元素使用初始值.

CSS3中添加了一个初始关键字,以允许作者明确指定此初始值.

inherit关键字表示使用分配给父级的任何值.

Answer 2

继承始终来自文档树中的父元素,即使父元素不是包含块也是如此.初始标记仅为元素提供其原始值.

Answer 3

继承:

inherit关键字指定属性应从其父元素继承其值.

例

初始:

initial关键字用于将CSS属性设置为其默认值.

例

Answer 4

继承

此关键字应用元素父级的值，

是否有意义。一些CSS属性（例如color或font-family）会自动继承，而其他属性（例如display或margin）则不会自动继承。但是，Inherited关键字应适用于所有CSS属性。

初始

此关键字应用CSS规范中定义的初始值。有时，这个初始值是有意义的（浮动：无），有时是出于历史原因而存在（背景重复：重复），有时规范作者做出了本质上是随机的但有些可辩驳的选择（颜色：黑色）。

Quirksmode网站上的更多内容

Answer 5

当父元素重新定义颜色时，将显示差异。

继承：使用父元素的绿色。

初始：使用初始（黑色）颜色。

例：

.green{color:green;border:1px solid #ccc;padding:6px;}
a {color:blue;}
a.inherit {color: inherit;}
a.initial {color: initial}

<div class="green">
  Green text in this &lt;div><br>
  <a href="">&lt;a href=""></a><br>
  <a href="" class="inherit">&lt;a href="" class="inherit"></a><br>
  <a href="" class="initial">&lt;a href="" class="initial"></a>
</div>