CSS選擇器是CSS中非常重要的部分，是用于選擇HTML元素的表達式。在CSS選擇器中，有許多種不同的選擇器，可以用于選擇元素的不同類型和屬性。下面列舉了30種常見的CSS選擇器：

1. 元素選擇器
p {
/* 樣式 */
}
2. id選擇器
#example {
/* 樣式 */
}
3. 類選擇器
.red {
/* 樣式 */
}
4. 屬性選擇器
a[target='_blank'] {
/* 樣式 */
}
5. 通配符選擇器
* {
/* 樣式 */
}
6. 子元素選擇器
ul >li {
/* 樣式 */
}
7. 相鄰兄弟選擇器
h1 + p {
/* 樣式 */
}
8. 一般兄弟選擇器
h1 ~ p {
/* 樣式 */
}
9. :first-child偽類選擇器
li:first-child {
/* 樣式 */
}
10. :last-child偽類選擇器
li:last-child {
/* 樣式 */
}
11. :nth-child偽類選擇器
li:nth-child(2n) {
/* 樣式 */
}
12. :nth-last-child偽類選擇器
li:nth-last-child(2n) {
/* 樣式 */
}
13. :first-of-type偽類選擇器
p:first-of-type {
/* 樣式 */
}
14. :last-of-type偽類選擇器
p:last-of-type {
/* 樣式 */
}
15. :nth-of-type偽類選擇器
p:nth-of-type(2) {
/* 樣式 */
}
16. :nth-last-of-type偽類選擇器
p:nth-last-of-type(2) {
/* 樣式 */
}
17. :only-child偽類選擇器
p:only-child {
/* 樣式 */
}
18. :only-of-type偽類選擇器
p:only-of-type {
/* 樣式 */
}
19. :not偽類選擇器
:not(p) {
/* 樣式 */
}
20. :empty偽類選擇器
p:empty {
/* 樣式 */
}
21. :checked偽類選擇器
input:checked {
/* 樣式 */
}
22. :disabled偽類選擇器
input:disabled {
/* 樣式 */
}
23. :enabled偽類選擇器
input:enabled {
/* 樣式 */
}
24. :focus偽類選擇器
input:focus {
/* 樣式 */
}
25. :hover偽類選擇器
a:hover {
/* 樣式 */
}
26. :active偽類選擇器
a:active {
/* 樣式 */
}
27. ::before偽元素選擇器
p::before {
/* 樣式 */
}
28. ::after偽元素選擇器
p::after {
/* 樣式 */
}
29. ::first-letter偽元素選擇器
p::first-letter {
/* 樣式 */
}
30. ::first-line偽元素選擇器
p::first-line {
/* 樣式 */
}