CSS选择器优先级与效率优化_html/css_WEB-ITnose

Date: 7th of Aug, 2015

Author: HaoyCn

本文收集网上各处关于CSS选择器的文章总结，并自己归纳一篇。

各类选择器的优先级

在上面的选择器中，此外，经测试

属性选择器 = 伪类选择器(应用最后一个)

:last-child{color:red;}[desc]{color:green;}

伪类选择器 > 相邻选择器

:last-child{color:green;}p ~ p{color:blue;}

相邻选择器 = 子选择器 = 后代选择器(应用最后一个)

p~p{color:red;}body p{color:blue;}body > p{color:green;}

后代选择器 > 标签选择器

p ~ p{color:blue;}p{color:green;}

样式位置的影响