div+css布局问题 为什么这段代码的.class样式无效,求高手解释下,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
h1,h2,h3{
font-size:12px;
}
#beijingyanse{
color:#00F;
background:#F00;
}
#beijingyanse .class{
font-size:36px;
}
</style>
</head><body>
<div id="beijingyanse">
<div class="daziti">
<h1>我的</h1>
</div>
<h2>我的</h2>
<h2>我的</h2>
</div>
<h3>我的</h3>
<h5>我的</h5>
<h6>我的</h6>
</body>
</html>

class ="daziti" 为何没在style定义?
#beijingyanse .daziti{
font-size:36px;
}
在html中所有的选择器都有权值,权值越大优先级别越高.
1. 内联样式表的权值最高 1000;(<div style="">)
2. ID 选择器的权值为 100;(#id)
3. Class 类选择器的权值为 10;(.class)
4. HTML 标签选择器的权值为 1;(p em..)
h1,h2,h3{
/* 权值 = 1 */
font-size:12px;
}
#beijingyanse{
/* 权值 = 101 */
color:#00F;
background:#F00;
}
#beijingyanse .daziti{
/* 权值 = 100+10=110 */
font-size:36px;
}
根据css继承特点,可简化为
<div id="beijingyanse">
<div class="daziti">
<h1>我的</h1>/*继承了beijingyanse,daziti样式,在加上自身的样式,此时的权值是100+10+1=111,同名属性覆盖,后者覆盖前者,所以"我的"应用的css为:"color:#00F;
background:#F00; font-size:12px;"*/
</div>
<h2>我的</h2>/*继承了beijingyanse样式,此时的权值是100+1=101,应用的css为:"color:#00F;
background:#F00; font-size:12px;"*/
<h2>我的</h2>
</div>

ps:二者应用的数属性相同,但权值不同.
参考: http://www.cnblogs.com/xugang/archive/2010/09/24/1833760.html
温馨提示:答案为网友推荐,仅供参考
相似回答