先看看这样的一个dom构造
<div class="parent">
<div class="child">
Child Text
<span class="text">Hello CSS</span>
</div>
</div>
CSS这样设置
* {
color: red;
}
.parent .child {
color: green;
}
那么,Hello CSS
,会是什么色彩呢?
会是红色。能够间接点开这个Demo查看成果。
*
和.parent .child
都能对Hello World
文字的色彩施加影响,而且.parent .child
放在前面,也没有*
的优先级高,所以显示了红色,而不是绿色。
星号选择器(*),示意抉择所有元素(MDN链接)。在这个示例中,星号蕴含了对.text
节点的色彩设置,其优先级,是高于从父节点.child
继承过去的色彩属性的。
发表回复