CSS继承和初始的区别是什么?

时间:2015-04-15 21:29:35

标签: css

在CSS方面,inheritinitial之间究竟有什么区别? 对我来说,他们总是一样,例如:

a.no-style{color: inherit}

将与

相同
a.no-style{color: initial}

6 个答案:

答案 0 :(得分:14)

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

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

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

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

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

来源:https://developer.mozilla.org/en-US/docs/Web/CSS/initial_value

答案 1 :(得分:12)

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

答案 2 :(得分:7)

继承:

  

inherit关键字指定属性应继承其值   来自其父元素。

example

首字母:

  

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

example

答案 3 :(得分:5)

继承

  

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

     
    

这是否有意义。一些CSS属性,例如颜色或     font-family,是自动继承的,但是其他的,如显示     或保证金,不是。 inherit关键字应该适用于所有CSS     但是,属性。

  

初​​始

  

此关键字应用CSS中定义的初始值   规格。有时这个初始值是有意义的(浮动:   没有),有时它出于历史原因(背景重复:   重复),有时规范编写者基本上做了   随机而有点防御的选择(颜色:黑色)。

来自Quirksmode网站

的更多信息

答案 4 :(得分:4)

父元素重新定义颜色后,就会显示出差异。

继承:使用父元素中的绿色。

初始:使用初始(黑色)颜色。

示例:

Snippet screenshot

.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>

答案 5 :(得分:-2)

Internet Explorer不支持

color : initial

相关问题