css优先级

所谓CSS优先级，即是指CSS样式在浏览器中被解析的先后顺序。

内联样式(inline style) > ID选择符 > 类选择符(class), 伪类(pseudo-class)和属*(attribute)选择符 > 类别(type)，伪对象(pseudo-element)

一,解释：

*内联样式(inline style)：元素的style属*，比如 <div style="color:red;"></div> ,其中的color:red;就是内联样式

*ID选择符：元素的id属*，比如 <div id="content"></div> 可以用 ID选择符#content

*类选择符：比如<div class="box"></div>，可以使用 类选择符 .box

*伪类(pseudo-class)：最常见的是锚(a)伪类，比如a:link,a:visited.

*属性选择符(attribute selectors)：比如div[class=demo],含有class为demo的div元素

*类别选择器(type selector)：HTML标签选择，比如div .demo,div元素下含有class为demo的元素

*伪对象选择器(pseudo-element selector)：比如div:first-letter,div元素下的第一个单词。

多重CSS样式定义，属性追加重复最后优先原则

一个标签可以同时定义多个class，也可以是同一个class中重复定义属性。例如：

我们先定义两个样式

.one{width:200px;background:url(images/imgA.jpg) no-repeat left top;}

.two{border:10px solid #000; background:url(images/imgB.jpg) no-repeat left top;}

在页面代码中，我们可以这样调用:<div class="one two"></div>

这样最终的显示效果是这个div样式是什么呢？？重复的是以哪一个为准呢？？

<div class="one two"></div>应用到的样式如下：

width:200px;

border:10px solid #000;

background:url(images/imgB.jpg) no-repeat left top;

因为，当应用两个或多个样式时，浏览器所应用的样式根据是 属性追加重复最后优先原则

就是说两个或多个或重复的样式名定义，浏览器所应用的样式是按先后顺序的，如果定义了重复的属性值，以最后定义的为准，如果应用了两个或多个样式名，里面不重复定义的

属性值就追加上去，重复的属性值就以最后一个为准。这里要注意的是，样式的先后不是根据页面上应用的名字顺序，而是样式表里的样式顺序。