【CSS】选择符

CSS元素选择符

优先级：id选择符 > class选择符 > 标签选择符

1.通配选择符(Universal Selector)：*{ sRules }

* 根据就近原则，要放在css代码的首行
* 适配文档中的所有html对象
* 用于定义html文档中所有对象的基础样式(消除浏览器默认设置的基础样式)
* 常见用法：*{margin:0; padding:0} 消除浏览器默认的内外边距
* 通常不建议使用通配选择符，因为它会遍历并命中文档中所有的元素，出于性能考虑，需酌情使用

2.类型选择符(Type Selector)：h1 h2 p...{ sRules }

* 以文档语言标签作为选择符

3.ID选择符(ID Selector)：#id值{ sRules }

* 以html标签的唯一标识符id属性的值作为对象，用#加id值作为选择符对象。

4.类选择符(Class Selector)：.class值{ sRules }

* 不同于ID选择符的唯一性，类选择符可以同时定义多个
.a {color: #f00;} 
.b {font-weight: 700;} 
<div class="a b">给某个div元素定义.a和.b两个类</div>

CSS组合选择符

1.包含选择符：父级对象a 子级对象b{ }

* 根据html对象的嵌套关系，指定某个元素的子级元素样式
* 选择符对象可以是多重包含，即一层层的包含下去，样式仅作用于最后的内部对象
* 元素对象之间用空格分隔
* 如：#box p a{color:red}

2.群组选择符：对象a,对象,b对象c...{ }

*  将同样的样式用于多个选择符对象，选择符之间用逗号隔开

3.指定选择符：标签名.class类名{ }

* 将标签选择符和class类选择符结合在一起使用
* 主要适用于在使用了某个class类的html对象中特别指定某一类标签