| 选择器类别 |
权重表示 |
权值表示 |
| 行内样式 |
（1.0.0.0） |
1000 |
| id选择器 |
（0.1.0.0） |
100 |
| 类选择器 |
（0.0.1.0） |
10 |
| 元素选择器 |
（0.0.0.1） |
1 |
- !important 表示强制应用该样式，例如：button{ width: 150px !important;}，与以上的选择器相遇时，强制使用此样式；IE6不支持该属性
- 如果比较后权重相同，那么后者覆盖前者，后渲染的胜出；
- 内联样式 > id选择器样式 > 类选择器样式 > 元素选择器样式；
- CSS选择器的使用，应该尽量避免使用 !important 和 内联样式；id通常也是与class区分开使用，前者多用于JS中的结点定位，后者多用于CSS选择器。
- 重中之重，1000/100/10/1这种权值系数的比较方式只是便于理解，真实情况下10个class并不能逆转1个id。
css引入方法
//外联式（应用于多个网页）
<link rel="stylesheet" href="style.css" type="text/css" /> //link 链接
@import url("style.css"); //@import 导入
//内联式（应用于当前页面）
<style type="text/css">
body{font-family:Arial,Helvetica,sans-serif;}
//内联 CSS 可以有效减少 HTTP 请求，提升页面性能，缓解服务器压力。
//由于浏览器加载完 CSS 才能渲染页面，因此能防止 CSS 文件无法读取而造成页面裸奔的现象。
</style>
// 嵌入式(应用于具体的标签)
<div style="font-family:Arial,Helvetica,sans-serif;">万维网</div>
