-
-
Save jikeytang/3657ed86b66be8e9a928 to your computer and use it in GitHub Desktop.
| 解释以下选择器的区别： | |
| 1. body 与 .body | |
| 2. .main .sub 与 (.main, .sub) | |
| 3. .main > .sub 与 .main .sub | |
| 4. .main + .sub 与 .main .sub | |
| 5. .main + .sub 与 .main > .sub | |
| 6. [abc^="def"] 与 [abc$="def"] 与 [abc*="def"] 与 [abc^="def"] 与 [abc|="def"] 与 [abc~="def"] | |
| 7. p:first-child 与 ::first-line | |
| 8. * 与 (.main *) | |
| 9. :nth-child 与 :nth-last-child 与 :nth-of-type 与 :last-child 与 :first-of-type 与 :empty | |
| PS: | |
| 1. 回复时注意加上下面这句话，才会有语法高亮或格式缩进。 | |
| ```html | |
| // you code | |
| ``` | |
| 2. 也可以粘贴jsfiddle地址，比如： | |
| http://jsfiddle.net/jikeytang/Rmt8M/ | |
| 评论支持markdown语法。 | |
| [http://jsfiddle.net/jikeytang/Rmt8M/](http://jsfiddle.net/jikeytang/Rmt8M/) |
1.body 是标签 .body 是Class 类名
2. .main .sub 是 后代选择器，选择类名为main 下的 所有类名为sub的元素 .main, .sub 是多标签选择器同时作用于多个元素之上
3. .main > .sub 是子类选择器 选择 .main 下 class名为sub 的子类元素 .main .sub 选择 类名为 main 下的 所有类名为 sub 的元素
4. .main + .sub 是相邻选择器 意思是 选择 类名为 main 的元素 的第二个类名为 sub 的兄弟元素 。 .main .sub 选择 类名为 main 下的 所有类名为 sub 的元素
5. .main + .sub 是相邻选择器 意思是 选择 类名为 main 的元素 的第二个类名为 sub 的兄弟元素 。.main > .sub 是子类选择器 选择 .main 下 class名为sub 的子类元素
6. [abc^="def"] 指 abc 下 以def 开头的 类 略过了 、、、、
7. p:first-child 是选择P标签下的第一个子类元素 ::first-line 是伪类 是选择 标签下的第一行
8. * 是指全局通配符 所有的标签都适用 .main * 是指 在类名为 .main 的元素下的所有标签
9. :nth-child 是指父元素的所有子元素,偶尔会写 :nth-child(第几个子元素) ， :nth-last-child 是指 父元素下的最后一个子元素， :nth-of-type 不知 :last-child 指类or标签元素下的最后一个子元素与
:first-of-type 与 :empty 这道题主要是考伪类 吧 我用的还是较少 只是前段时间看过书上写过 了解一点点 用的很少
用的较少 6题与9题 看到都有点眼晕不想做。 哎 还需要学习 ！！！
补充最后的:empty 匹配没有子元素或者没有内容的元素，其他的认为1楼答的都很好
为何哥的一楼就是被吐槽 别人的一楼都是表扬
1
2
3
4
5
.main + .sub表示相邻兄弟选择器，即紧接在main后面，且二者有相同的父元素，可以应用该样式； .main > .sub表明main子代的sub类可以用的样式；6
7
8
9
好多概念都很模糊，一个个查了一遍，总算答完了O(∩_∩)O