css样式的优先级及在模块中的书写顺序及选择器的优先权

1.css样式的优先级

（外部样式）External style sheet <（内部样式）Internal style sheet <（内联样式）Inline style

1）外部样式：指的是通过link标签引入的样式

2）内部样式：指的是写在<style type='text/css'></style>中的class样式或者id样式

3）内联样式：指的是直接作用在内部标签上的。例如:<span style='display:inline-block;color：red;font-size:14px;'>我是为了演示内联样式的</span>

2.css样式在模块中的书写顺序

一般是自身的显示属性，例如：position、display、visibility、float、clear、list-style、top等

然后是自身属性，例如：width、height、margin、padding、border、overflow、min-width等

最后是文本属性及其他修饰，例如：font、text-align、text-decoration、vertical-align、white-space、color、background等。

如果属性之间存在关联性。则不要隔开写。

3、选择器的优先权

1）  内联样式表的权值最高 1000；

2）  ID 选择器的权值为 100

3）  Class 类选择器的权值为 10

4）  HTML 标签选择器的权值为 1

4、CSS 优先级法则

1）  选择器都有一个权值，权值越大越优先；

2）  当权值相等时，后出现的样式表设置要优于先出现的样式表设置；

3）  创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式；

4）  继承的CSS 样式不如后来指定的CSS 样式；

5）  在同一组属性设置中标有“!important”规则的优先级最大；示例如下：