以下是 CSS 中常见的各种样式选择器:
1. 元素选择器:通过 HTML 元素名称选择元素,如 `p`、`div` 等。
2. 类选择器(Class Selector):通过 `class` 属性选择一个或多个具有相同类名的元素,如 `.example`。
3. ID 选择器(ID Selector):通过 `id` 属性选择具有唯一标识符的元素,如 `#uniqueID`。
4. 属性选择器(Attribute Selector):通过属性名称和属性值来选择元素,如 `[attribute="value"]`。
5. 后代选择器(Descendant Selector):通过嵌套关系选择元素,如 `parent child`。
6. 直接子元素选择器(Child Selector):选择指定父元素下的直接子元素,如 `parent > child`。
7. 相邻兄弟选择器(Adjacent Sibling Selector):选择紧接在指定元素后的兄弟元素,如 `element + sibling`。
8. 全部兄弟选择器(General Sibling Selector):选择在指定元素后的所有兄弟元素,如 `element ~ sibling`。
9. :hover 伪类选择器(Hover Pseudo-class Selector):选择鼠标悬停在元素上的状态,如 `:hover`。
10. :active 伪类选择器(Active Pseudo-class Selector):选择元素处于活动(被点击)状态的样式,如 `:active`。
11. :focus 伪类选择器(Focus Pseudo-class Selector):选择元素获取焦点的样式,如 `:focus`。
12. :nth-child() 伪类选择器(Nth-child Pseudo-class Selector):选择指定在其父元素中的索引位置的子元素,如 `:nth-child(n)`。
13. :first-child 伪类选择器(First Child Pseudo-class Selector):选择父元素中的第一个子元素,如 `:first-child`。
14. :last-child 伪类选择器(Last Child Pseudo-class Selector):选择父元素中的最后一个子元素,如 `:last-child`