原来回复51js上面一个兄弟的问题，害怕在茫茫的信息之海中会被淹没，暂时转到这儿来，以示学习总结之意。
在回答别人问题时，对自己真是一个考验提高，在总结，摸清原有模糊概念的基础上要讲，全，简，易。真是不容易。佩服那些写教程福利芸芸众生的先行者们~！！
下面简单谈谈css的权重：
权重简单的也可以理解为JavaScript中的作用域，回头仔细想想，其实所有的IT抽象世界的东东都是通的。
内嵌样式 > 内部样式表 > 外联样式表
如：
<head>
<link href="main.css" rel="stylesheet" type="text/css" />
<style>
.txt{color:blue;}
</style>
</head>
<p class="txt" style="color:red">这是一个测试文本</p>
main.css中：
.txt{color:green}
这三个里边：
内嵌样式：
style="color:red"
内部样式表：
<style>
.txt{color:blue;}
</style>
外联样式表：
main.css
中内容。
这是大体上的css权重量级别，一般常用外联。
然后我们在看常用的main.css中权重级别：
在main.css 中：
id选择器的权重是大于类选择器的权重。
如：
#test{color:red;}
.test{color:blue;}
其中#test的大于.test的权重。
另外如果在一个css文件中出现两个同命的css属性值，那会怎么样呢？当然跟其它面向对象程序语言中的，覆盖相似，下面的属性会覆盖掉上面的属性。如：
.test2{color:red;border:1px solid #ccc;}
.test2{color:blue;font-size:14px;}这样最终应用到DOM元素上的样式是：
color:blue;font-size:14px;border:1px solid #ccc;
<!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" xml:lang="en">
<head>
<title>豪情</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style type="text/css">
*{margin:0;padding:0;font-size:12px;}
.test2{color:red;border:1px solid #ccc;}
.test2{color:blue;font-size:14px;}
</style>
</head>
<body>
<div class="test2">这是一个test2的内容</div>
</body>
</html>
运行代码
还有一种情况是层次选择器下面权重的延伸，这种情况是用js操作动态效果时可以节省不少js代码，在逻辑上面来说，展现与行为的分离也是尽善尽美。
.txt{color:blue;}
#wrap .txt{color:red;font-size:14px;}如：
<!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" xml:lang="en">
<head>
<title>豪情</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style type="text/css">
*{margin:0;padding:0;font-size:12px;}
.txt{color:blue;}
#wrap .txt{color:red;font-size:14px;}
</style>
<head>
<body>
<div class="txt">这是一个txt文本</div>
<div id="wrap">
<div class="txt">这又是一个txt文本</div>
</div>
</body>
</html>
运行代码
