【前端】打卡挑战 Day 1 CSS 选择器有哪些？优先级分别是什么？...的全部评论

css的选择器：

类选择器，标签选择器，id选择器，属性选择器，后代选择器，相邻兄弟选择器(+)， 通用选择器，伪类选择器等

权重是!import最高 接下来是内联样式权重999 id权重100 类和属性10 标签和通用10

!important>内联 > ID选择器 > 类选择器 > 标签选择器。

通配符选择器:* 权重为0

元素选择器:<div> 权重为1

类选择器: .class 权重为10

id选择器: #id 权重为100

!important: 权重为1000

伪元素选择器:权重为1

伪类选择器:权重为10

后代选择器: 空格表示

子选择器: >

相邻兄弟选择器:+

属性选择器:input[type='text']<...

id选择器，类选择器，标签选择器，子元素选择器，伪类选择器，后代选择器

优先级最高的是！important，其次从高到低依次是ID选择器，类选择器，标签选择器，子元素选择器，后代选择器，伪元素选择器

1、标签选择器

2、ID选择器

3、类选择器

4、伪类选择器

优先级：!important>行内样式>ID选择器>类与伪类选择器>标签选择器>通用选择器

1. id选择器：#开头，

2. 类名选择器：class=“”，使用时以 . 开头，

3. 标签选择器： 直接选择如p标签使用

4. 后代选择器： #box div 选择id为box元素内部所有的div元素

5. 相邻同胞选择器：.one+.two 选择紧接在.one之后的所有.two元素

优先级：内联样式 > id选择器 > 类名选择器 > 标签选择器

CSS选择器类别：

1. 元素选择器，div,p,h1这些
2. 类选择器，class=“”
3. id选择器，#什么什么=“”
4. 兄弟选择器，~
5. 相邻选择器，+号相邻元素。
6. 伪元素选择器，两个分号，::before,::after等,这两个要配合content使用，其他有::first-letter,
7. 伪类选择器，一个分号，...

id>类选择器>标签

类选择器 . 优先级 ：100

id选择器 # 优先级 ：1000

兄弟选择器 + 优先级 ：100

后代选择器 > 优先级 ：100

子元素选择器 添加空格 优先级 ：100

元素选择器 比如 div {} 优先级 ：1

伪类选择器 :nth-child :last-child :fist-child :nth-of-type