css - * CSS 规则如何比类或 ID 样式规则更具体？

Question

我使用 * 选择器来表示除非另有说明，否则网站上的字体颜色应设置为特定值。

*{

font-family:"Verdana";
color: #04468e;
}

到目前为止一切顺利。问题是这是最通用的规则，它应该很容易被覆盖，例如

#profileMessageBoxHeader
{
background:url('images/profileMessageHeaderGradient.png') repeat-x #208ff6;
height:178px;
border-radius:10px 10px 0px 0px;
color:#fff; 
}

所以下面的代码...

<div id="profileMessageBox">
    <div id="profileMessageBoxHeader">
        <
        <p>Please fill out the form and click submit.  Your entered profile data will be provided to the tutor, to allow them to contact you.</p>
    </div>
</div>

应该生成白色文本。但是，出于某种原因，极其通用的 * 规则会覆盖更具体的 ID 规则。为什么？

Answer 1

* 是通用选择器并覆盖#profileMessageBoxHeader 上的设置。与手动设置 BODY、H1、P、TABLE、TR、TD、TH、PRE、UL、LI、ETC 相同。有关它的更多信息以及它如何规避继承，Eric Meyer has a good article .

应用以下内容，它应该可以工作:

#profileMessageBoxHeader p
{
    color: #FFF;
}

样本:http://jsfiddle.net/x7AnM/