.CSS主要选择器有哪些?如何使用?
时间: 2023-12-03 17:47:43 浏览: 73
CSS主要选择器包括:
1. 元素选择器(Element Selector):通过元素的标签名来选择元素,例如 `p` 、 `h1` 、 `div` 等。
2. 类选择器(Class Selector):通过元素的 class 属性来选择元素,例如 `.example` 。
3. ID选择器(ID Selector):通过元素的 id 属性来选择元素,例如 `#example` 。
4. 属性选择器(Attribute Selector):通过元素的属性值来选择元素,例如 `[type="text"]` 。
5. 伪类选择器(Pseudo-class Selector):通过元素的状态来选择元素,例如 `:hover` 、 `:active` 、 `:visited` 等。
6. 后代选择器(Descendant Selector):通过元素的后代关系来选择元素,例如 `div p` 。
7. 子元素选择器(Child Selector):通过元素的子元素关系来选择元素,例如 `div > p` 。
8. 相邻兄弟选择器(Adjacent Sibling Selector):通过元素的相邻兄弟关系来选择元素,例如 `h1 + p` 。
9. 通用选择器(Universal Selector):通过任何元素来选择元素,例如 `*` 。
使用方式:在 CSS 中,选择器与样式规则组成了一个完整的样式声明。例如:
```
p {
color: red;
}
.example {
background-color: yellow;
}
#example {
font-size: 16px;
}
```
其中, `p` 、 `.example` 、 `#example` 就是不同的选择器,后面的花括号中则是对应的样式规则。
阅读全文