[分享]css八种选择器归类

CSS是网页设计中非常重要的一部分，其中选择器的使用尤为重要。CSS中可以使用8种不同类型的选择器，分别是：1. 元素选择器 2. 类选择器 3. ID选择器 4. 后代选择器 5. 子代选择器 6....

CSS是网页设计中非常重要的一部分，其中选择器的使用尤为重要。CSS中可以使用8种不同类型的选择器，分别是：

1. 元素选择器
2. 类选择器
3. ID选择器
4. 后代选择器
5. 子代选择器
6. 相邻兄弟选择器
7. 通用选择器
8. 属性选择器 

接下来逐一介绍这8种选择器：

1. 元素选择器：

p {
  color: red;
} 

该选择器使用HTML标签来选择元素，设置样式。

2. 类选择器：

.blue {
  color: blue;
} 

该选择器使用class属性来选择元素，并设置样式。

3. ID选择器：

#main {
  font-size: 24px;
} 

该选择器使用id属性来选择元素，并设置样式。

4. 后代选择器：

div p {
  font-weight: bold;
} 

该选择器选取父元素中所有后代元素，设置样式。

5. 子代选择器：

div > p {
  text-align: center;
} 

该选择器只选取直接子元素，设置样式。

6. 相邻兄弟选择器：

h1 + p {
  margin-top: 20px;
} 

该选择器选取紧接在另一个元素后面的元素，设置样式。

7. 通用选择器：

* {
  box-sizing: border-box;
} 

该选择器选取所有元素，设置样式。

8. 属性选择器：

a[href$='.pdf'] {
  color: red;
} 

该选择器选取属性具有特定值的元素，设置样式。