css选择器

css选择器权重

从高往低列：

选择器	权重
!important	Infinity
内联样式	1000
ID选择器	100
类选择器｜属性选择器｜伪类选择器	10
标签选择器｜伪元素	1
通配符	0

根据上表权重相加计算并比较，值越大权重越大

复杂选择器及简单示例

<div>
    <p>1</p>
    <div class="box">
        <p>2</p>
    </div>
    <input title="属性选择器" />
</div>

• 父子选择器（派生选择器）：div p{}
• 直接子元素选择器：div > p{}
• 属性选择器：[title]{} 或者 [title="属性选择器"]{}
• 并列选择器：div.box{}
• 分组选择器：.box,input{}