* CSS规则如何比类或ID样式规则更具体?

前端之家收集整理的这篇文章主要介绍了* CSS规则如何比类或ID样式规则更具体?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用*选择器来指示除非我另行指定,否则网站上字体的颜色应设置为某个值.
  1. *{
  2.  
  3. font-family:"Verdana";
  4. color: #04468e;
  5. }

到现在为止还挺好.问题在于,这是最常规的规则,它应该很容易被覆盖,例如

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

所以下面的代码……

  1. <div id="profileMessageBox">
  2. <div id="profileMessageBoxHeader">
  3. <
  4. <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>
  5. </div>
  6. </div>

应该产生白色文字.但是,出于某种原因,极其通用的*规则会覆盖更具体的ID规则.为什么?

解决方法

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

应用以下内容,它应该工作:

  1. #profileMessageBoxHeader p
  2. {
  3. color: #FFF;
  4. }

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

猜你在找的CSS相关文章