CSS优先权之深入剖析(1)

在特殊性的框架下,被继承的特性值为0,这就意味着任何显示声明的规则将会覆盖其继承样式。因此,不管一条规则具有多高的权重,如果没有规则能应用于这个继承元素,那么它也只是个被继承的规则而已,举例说明。
程序<a href=代码"/> 程序代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http[color=#0080C0]://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.52css.com</title>
<style type="text/css">
<!--
body{background:000;}  /*黑*/
li {color:#ccc;}  /*灰*/
ul {color:#fff;font-size:38px;}  /*白*/
-->
</style>
</head>
<body>
<ul>
  <li>www.52css.com 我爱CSS 1</li>
  <li>www.52css.com 我爱CSS 2</li>
  <li>www.52css.com 我爱CSS 3</li>
  <li>www.52css.com 我爱CSS 4</li>
  <li>www.52css.com 我爱CSS 5</li>
  <li>www.52css.com 我爱CSS 6</li>
  <li>www.52css.com 我爱CSS 7</li>
  <li>www.52css.com 我爱CSS 8</li>
</ul>
</body>
</html>[/color]
我们看到,文字显示的是灰色(应用li的样式),而不是白色。字体的大小为38px(应用了ul的样式)。我们可以得出这样的直观结论。同样的样式,越靠近的权重越大,而未定义的样式则直接继承过来。
程序<a href=代码"/> 程序代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http[color=#0080C0]://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>www.52css.com</title>
<style type="text/css">
<!--
h1#hei {color:black;}
em {color:red;}
-->
</style>
</head>
<body>
<h1 id="hei">CSS优先权之深入剖析 <em>52css.com</em> 我爱CSS</h1>
</body>
</html>[/color]
 52css.com显示为红色,而其它文字均为黑色。

文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相关日志:
评论: 0 | 引用: 0 | 查看次数: -
发表评论
昵 称:
密 码: 游客发言不需要密码.
内 容:
验证码: 验证码
选 项:

虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号.