CSS3选择器参考手册

1. 元素选择器

选择HTML元素。例如，p 选择器会选择页面上的所有 p 元素。

p {  
  color: red;  
}

2. 类选择器

使用. 来选择带有特定类的元素。例如，.intro 选择器会选择所有带有 'intro' 类的元素。

.intro {  
  font-size: 20px;  
}

3. ID选择器

使用# 来选择带有特定ID的元素。例如，#header 选择器会选择ID为 'header' 的元素。

#header {  
  background-color: black;  
}

4. 属性选择器

选择具有特定属性的元素。例如，[target] 选择器会选择所有具有 'target' 属性的元素。

[target] {  
  background-color: yellow;  
}

5. 子代选择器

使用> 来选择特定元素的直接子元素。例如，div > p 选择器会选择所有 div 元素的直接 p 子元素。

div > p {  
  color: blue;  
}

6. 后代选择器

使用空格来选择特定元素的所有子元素。例如，div p 选择器会选择所有 div 元素内的 p 子元素。

div p {  
  color: green;  
}

7. 相邻同胞选择器

使用+来选择特定元素的下一个同胞元素。例如，div + p 选择器会选择每个 div 元素的下一个 p 同胞元素。

div + p {  
  color: purple;  
}

8. 通用同胞选择器

使用~来选择特定元素的所有后续同胞元素。例如，div ~ p 选择器会选择每个 div 元素后面的所有 p 同胞元素。

div ~ p {  
  color: orange;  
}

9. 通配符选择器 (*)

可以用来选择所有的HTML元素。例如，* 选择器会选择页面上的所有元素。

附css选择器大全

本文地址：https://www.tides.cn/p_docs-css3-selectors