大！重要！麻烦

我还是不明白，哪一种颜色会出现段落“test1”，为什么？大！重要！麻烦

<style> 
    p { 
    color: red; 
    font-style: italic; 
    } 
</style> 

<div style="color: green;!important"> 
    <p style="color: blue;">test1</p> 
    <p>test2</p> 
</div>

来源

2012-06-12 user1337432

重要性不会级联。

即使父元素（<div>）具有!important属性（请注意，由于语法错误，它实际上没有），它仍将被应用于子元素的任何属性覆盖。

!important只能覆盖应用于相同元素的其他规则。

因此，第一个<p>将是蓝色的，因为没有什么可以重写它的内联样式。

来源

2012-06-12 18:19:33 SLaks

+1关于“重要”不级联。 –

谢谢，不知道！重要的不是级联。 – user1337432

它会是蓝色的，因为它有一个使它变蓝的style属性。 div表示绿色，但在分号后面有!important标志。但即使你有一个空格而不是分号，style属性也会覆盖它。它将是蓝色的。

来源

2012-06-12 18:18:34

不，它不会改变任何东西 - http://jsfiddle.net/V7myQ/ –

哪个颜色会出现段落“test1”，为什么？

蓝色。即使你的错字，它仍然是蓝色的。 color: green !important样式仅适用于div中的文字。因此内联风格的color: blue;是最具有特定。

查看this fiddle的区别。

我鼓励你了解how CSS specificity works。

来源

2012-06-12 18:18:36

谢谢你的回复。 – user1337432

大！重要！麻烦

回答

相关问题