分类:
-
元素选择器
- 标签:
使用标签作为选择
<p>
- ID:
使用ID作为选择
#id值
- 类(class):
.class值
使用类作为选择
- 标签:
-
关系选择器
- 后代选择器(空格)
div p
选择所有div标签下的所有p标签(>) - 子代选择器
div>p
选择所有div标签下的直接(一层)儿子p标签 - 交集选择器(没有分割)
div.class1
选择所有的div标签,class=class1的标签,两个相交的部分 - 并集选择器(,)
h2,p
同时选择所有h2标签和所有p标签
- 后代选择器(空格)
<div>
<h2>我是标题</h2>
<p>我是段落1</p>
<p class="class1">我是段落2</p>
</div>
-
兄弟选择器
- 只选择后面的一个+
h2+p
只选择“我是段落1” - 选择后面的所有~
h2~p
选择后面的所有p标签
- 只选择后面的一个+
-
序选择器
只有一个(only)
:only-child
第一个(first)
:first-child
:first-of-type
最后一个(last)
:last-child
:last-of-type
第几个(n,可以是数字;odd;even;xn+y)
:nth-child(n)
:nth-of-type(n)
倒数第几个(last n,可以是数字;odd;even;xn+y)
:nth-last-child(n)
:nth-last-of-type(n)