css权重简单之谈
原来回复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>
<link href="main.css" rel="stylesheet" type="text/css" />
<style>
.txt{color:blue;}
</style>
</head>
<p class="txt" style="color:red">这是一个测试文本</p>
.txt{color:green}
内嵌样式：
style="color:red"
<style>
.txt{color:blue;}
</style>
.txt{color:blue;}
</style>
外联样式表：
中内容。
这是大体上的css权重量级别，一般常用外联。
然后我们在看常用的main.css中权重级别：
在main.css 中：
id选择器的权重是大于类选择器的权重。
如：
#test{color:red;}
.test{color:blue;}
.test{color:blue;}
另外如果在一个css文件中出现两个同命的css属性值，那会怎么样呢？当然跟其它面向对象程序语言中的，覆盖相似，下面的属性会覆盖掉上面的属性。如：
.test2{color:red;border:1px solid #ccc;}
.test2{color:blue;font-size:14px;}
.test2{color:blue;font-size:14px;}
color:blue;font-size:14px;border:1px solid #ccc;
还有一种情况是层次选择器下面权重的延伸，这种情况是用js操作动态效果时可以节省不少js代码，在逻辑上面来说，展现与行为的分离也是尽善尽美。
.txt{color:blue;}
#wrap .txt{color:red;font-size:14px;}
#wrap .txt{color:red;font-size:14px;}
