CSS 选择器优先级:html、body 和通用选择器*(已更新)
问题出现:三个规则在以下情况下有何不同应用于同一个 HTML 文档?让我们探讨一下这些选择器的独特效果:html、body 和通用选择器 *.
html 选择器:
<pre class="brush:php;toolbar:false">color: black; background-color: white;
}
此规则将颜色和背景样式应用于元素。它的后代继承颜色但不继承背景,包括
和 。元素。 <主体>元素缺少默认背景,使其透明,显示尽管覆盖了整个视口,但 仍然覆盖了整个视口。元素的背景不会自动扩展其高度;它只是渗透到视口中。
主体选择器:
<pre class="brush:php;toolbar:false">color: black; background-color: white;
}
此规则将颜色和背景样式应用于
;元素。它的所有后代都会继承它的颜色。类似于 ;背景、背景会自动传播到 中。元素,除非显式覆盖。因此,当使用单个背景时,请将其放置在 或 上。或
但是,组合 的背景样式会产生显着差异。和<主体>可以产生独特的效果,如下所示。
通用选择器 (*):
<pre class="brush:php;toolbar:false">color: black; background-color: white;
}
pre>
此规则影响每个元素,使任何隐式继承无效。但它很容易被其他规则覆盖,包括 和<主体>规则,由于缺乏特异性。
除非绝对必要(通常对于特定的孤立元素),否则通常不鼓励使用通用选择器中断继承,因为它可能会破坏所有受影响属性的继承链。
以上是`html`、`body` 和通用选择器 (*) 在 CSS 选择器优先级上有何不同?的详细内容。更多信息请关注PHP中文网其他相关文章!