CSS样式选择器是用于选择页面上特定元素的模式，以便将样式应用于它们，以下是CSS中常用的样式选择器及其用法：
1. 元素选择器：元素选择器是最基本的选择器，它根据HTML元素的名称选择元素，`p`选择器会选择页面上的所有段落元素。
p {
color: red;
}
2. 类选择器：类选择器使用`.`后跟类名来选择具有指定类的元素，类选择器可以通过HTML元素的`class`属性进行关联。
.my-class {
background-color: yellow;
}
3. ID选择器：ID选择器使用`#`后跟ID名称来选择具有指定ID的元素，ID选择器在页面上是唯一的，通常用于选择页面上的单个特定元素。
#my-id {
font-size: 24px;
}
4. 后代选择器：后代选择器使用空格分隔两个元素名称，以选择嵌套在另一个元素内部的元素，`div p`会选择所有嵌套在`div`元素内部的段落元素。
div p {
color: blue;
}
5. 子元素选择器：子元素选择器使用`>`来选择直接子元素，`div > p`只会选择直接嵌套在`div`元素内部的段落元素。
div > p {
color: green;
}
6. 相邻兄弟选择器：相邻兄弟选择器使用`+`来选择紧接在另一个元素之后的第一个兄弟元素，`div + p`会选择所有紧接在`div`元素之后的第一个段落元素。
div + p {
color: purple;
}
7. 通用兄弟选择器：通用兄弟选择器使用`~`来选择所有在另一个元素之后的兄弟元素，`div ~ p`会选择所有在`div`元素之后的所有段落元素。
div ~ p {
color: orange;
}
8. 属性选择器：属性选择器根据元素的属性及属性值来选择元素，`input[type="text"]`会选择所有类型为“text”的输入元素。
input[type="text"] {
background-color: gray;
}
9. 伪类选择器：伪类选择器用于选择特定状态的元素，例如悬停、被点击、焦点等，`:hover`会选择鼠标悬停在上面的元素。
a:hover {
color: pink;
}
10. 伪元素选择器：伪元素选择器用于选择特定部分的元素，例如元素的第一个字、第一个行、插入内容等，`::before`会在元素的内容前插入新内容。
以上是CSS中常用的一些样式选择器，它们提供了灵活的方式来选择和样式化HTML元素，通过组合这些选择器，可以实现更复杂的选择需求，并创建高度特定的样式效果。
