【CSS】css层叠特性总结

所谓的css层叠特性其实就是临近原则，即选择与自己关系最近表达最具体的来执行：

 

• CSS选择器优先级：

行内样式 > ID样式 >类别样式>标记样式

 

行内样式直接写在HTML相应标签内

 E.g. <p class="classStyle" id="idStyle" style="color:red">Hello World</p>  

ID样式通过id属性创建，具有唯一性，即更具体。

类别样式通过class属性创建，不具有唯一性，但也缩小了范围。

标记样式直接用标签来选择，范围很大。

E.g.  p{color:yellow}  

 

•  对于外部样式表，如果同时链入了多个样式表，执行顺序按临近原则，即排在最下面的优先级最高。

<link type="text/css"rel="stylesheet" href="css2.css" />

<link type="text/css"rel="stylesheet" href="css1.css" />

css1.css样式表排在下面离body最近，所以具有最高优先级，可以覆盖其上面样式表的样式。