前端面试题：常见选择器有哪些？选择器的权重

常见选择器有哪些

1. ✨ 通配符选择器 *

2. 选择器 div{}

3. 类选择器 .className

4. ID选择器 #idName

5. 伪元素选择器 p:after p:before

6. 伪类选择器 a:hover a:link

7. 结构伪类选择器 div:first-child div:nth-child(n)

注：n是表达式比如  nth-child(2n) 表示偶数 nth-child(2n+1) 表示奇数 

8. 属性选择器

• div[att] 具有att属性的div元素
• div[att^=“val”] 匹配att属性值以 val 开头的div元素

9. 后代选择器 div a{}

10. ❤️子代选择器 div>a

11. 并集选择器 h1,h2{}

12. ✨交集选择器 div.btn 匹配具有类名为btn的div标签

13. 兄弟选择器 h2+div 匹配h2标签后面紧跟的第一个div标签

---

选择器的权重问题

选择器	权重
!important	无穷大
行内选择器	1000
id选择器	100
类、伪类、结构伪类、属性选择器	10
标签、伪元素选择器	1
通配符选择器	0

---