机制和原理
CSS是一种样式表语言，用于为HTML(或其他)文档定义样式,包括字体、颜色、边距、高度、宽度、背景图像、布局等等。
HTML用于结构化内容,CSS用于格式化结构化的内容,CSS让HTML文档的表示和内容分离成为可能。
基本结构
CSS的基本概念就是选择HTML元素然后设定选择元素的样式，选择器+样式设置即构成了一条CSS规则。
CSS规则的语法结构如下：
selector1 {
property1 : value1;
property2 : value2;
propertyn : valuen;
}
除一般的规则之外，CSS中还有其他比如定义字符集，导入其它的外部样式表，字体等比较特殊的命令，这些是通过at规则语句来实现的。
选择器
选择器用来指定设置样式的对象元素。CSS提供了以下几类选择方法：
- 属性指定
通过指定标签、ID、类即其他任意属性和属性值来选择样式适用的对象元素 - 状态指定
通过指定状态（如光标是否停在在面、链接是否已被点击得过等等)选择样式适用的场面。 - 关系指定
通过指定关系（如某某元素的子元素等等)选择样式适用的对象元素。
以上的方法可以单独指定，也可以自由组合使用。
样式的适用
从CSS的基本结构可以看到，CSS的基本单位是规则。同一个HTML元素可能同时适用有多个规则，如果这些规则定义的样式存在重叠，那应该适用哪个规则呢？
基于这个问题，CSS为规则提供了一个权重的概念，不同的规则拥有不同的权重值，大致是这样一个大小顺序：“important > 内联 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 通配符 > 继承。
权重值高的规则优先获得匹配，权重值相同的规则则是后者优先。