1 选择器的概述
css选择器,能对HTML结构中的一个或者一类元素通过选择器属性进行标记,然后可以通过这些标记找到对应的元素,为其添加样式。
1.1 选择器分类
1.1.1 标签选择器
通过标签的名字,找到与标签名对应的元素:
示例:
选择器( 标签名 ):div{
margin:0;
}
选中标签:
**<div></div>**
特性:
标签名选择器没有太多特性,适用于一个范围内的同一元素需要统一添加相同的样式的时候,比如列表标签。
*通配符
通配符是一个特殊的标签选择器,作用为选中所有的标签。
1.1.2 id选择器
通过标签的ID名属性的值,找到与ID名对应的元素:
示例:
选择器( # ):#nav{
margin:0;
}
选中标签:
<div id="nav"></div>
特性:
A. id名具有唯一性,同一个id名在整个界面只能出现一次
B. 同一个标签只能有一个id名。一个id名指的是id的属性值也只能有一个。
1.1.3 class选择器
通过标签的类名属性的值,找到与类名对应的元素:
示例:
选择器( . ):.box{ margin:0; }
选中标签:
(多个类名)
特性:
A. 同一个类名在一个界面可以按需求出现多次
B. 同一个标签可以有多个类名,类名之间用空格隔开
类名相当于属性值
1.2 选择器使用场景
CSS样式书写过程中,类名占据了绝大部分,因为具有复用的特性,而且使用非常灵活,建议优先使用。
其次是标签名ÿ