我还是不明白,“test1”段落将是哪种颜色,为什么?
<style>
p {
color: red;
font-style: italic;
}
</style>
<div style="color: green;!important">
<p style="color: blue;">test1</p>
<p>test2</p>
</div>
哪种颜色将是段落“test1”,为什么?
蓝色。即使你的错字,它仍然是蓝色的。该color: green !important
样式仅适用于div
. 因此内联样式color: blue;
是最具体的。
请参阅此小提琴中的差异。
我鼓励您了解CSS 特殊性是如何工作的。
重要性不会级联。
即使父元素 ( <div>
) 具有!important
属性(请注意,由于语法错误,它实际上没有),它仍将被应用于子元素的任何属性覆盖。
!important
只能覆盖应用于同一元素的其他规则。
因此,第一个<p>
将是蓝色的,因为没有什么可以覆盖它的内联样式。
它将是蓝色的,因为它有一个样式属性使它变成蓝色。div 表示绿色,但!important
分号后有标志。但即使你有一个空格而不是分号,样式属性也会覆盖它。它将是蓝色的。