CSS选择器大全详解：
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
CSS选择器大全详解：
1.标签选择器
2.类选择器
3.id选择器
4.A B表示后代选择器
5.A,B表示与集选择器
6.A.B表示交集选择器
7.A*表示A的所有后代元素,如果A是<body>可省略A不写
8.A+B表示选择紧接着A元素后的B元素(A和B有共同的父元素)
h1 + p {margin-top:50px;}
选择紧接在 h1 元素后出现的段落，h1 和 p 元素拥有共同的父元素
9.A~B:
p~ul选择器 p之后出现的所有ul。
两种元素必须拥有相同的父元素，但是 ul不必直接紧随 p。
10.A>B:
css3特有的选择器，A>B 表示选择A元素的所有子B元素。
与A B的区别在于，A B选择所有后代元素，而A>B只选择一代。
11.p:first-child选择属于其父元素的首个子元素的每个<p> 元素
设置每个 <ul> 的首个子元素，并设置其样式：
ul>:first-child
{
background:yellow;
}
12.:only-child
:only-child 选择器匹配属于其父元素的唯一子元素的每个元素。
ul li:only-child
选择属于ul唯一li的li
st-child
p:last-child
指定属于其父元素的最后一个子元素的 p 元素的背景色
14.nth-child()
:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。
n 可以是数字、关键词或公式。
规定属于其父元素的第二个子元素的每个 p 的背景色：
p:nth-child(2)
{
background:#ff0000;
}
15.nth-last-child()
规定属于其父元素的第二个子元素的每个p 元素，从最后一个子元素开始计数：
p:nth-last-child(2)
{
background:#ff0000;
}
16.first-of-type
指定父元素的首个 p 元素的背景色：
p:first-of-type
{
background:#ff0000;
}
:first-of-type 选择器匹配属于其父元素的特定类型的首个子元素的每个元素。
提示：等同于 :nth-of-type(1)。
17.nth-of-type(n)
规定属于其父元素的第二个 p 元素的每个 p：
p:nth-of-type(2)
{
background:#ff0000;
}
:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.
n 可以是数字、关键词或公式。
提示：请参阅:nth-child() 选择器，该选择器选取父元素的第N 个子元素，与类型无关。
18.only-of-type
:only-of-type 选择器匹配属于其父元素的特定类型的唯一子元素的每个元素
st-of-type
:last-of-type 选择器匹配属于其父元素的特定类型的最后一个子元素的每个元素。
20.empty
:empty 选择器匹配没有子元素（包括文本节点）的每个元素
21.:not(X)选择除了X选择器以外的元素
22.属性选择器
选择器描述
[attribute] 用于选取带有指定属性的元素。
[attribute=value] 用于选取带有指定属性和值的元素。
[attribute~=value] 用于选取属性值中包含指定词汇的元素。
[attribute|=value] 用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
[attribute^=value] 匹配属性值以指定值开头的每个元素。
[attribute$=value] 匹配属性值以指定值结尾的每个元素。
[attribute*=value] 匹配属性值中包含指定值的每个元素。
A[attribute]选择所有拥有attribute属性的A。