1、否定伪类选择器
div:not(div2) //除div2之外的全部div
2、同一父元素下最后(第一)一个元素
//最后一个
li: last-child{
color: red;
}
//第一个
li: first-child{
color: red;
}
//任意一个
li: nth-child(3){
color: red;
}
3、父元素下只是一个子元素
span: only-child{
color: red;
}
---------------------
<p>
<span>伪类</span>//只有这行变红
</p>
<p>
<span>伪类1</span>
<span>伪类2</span>
<span>伪类3</span>
</p>
4、匹配空元素(没有子元素的元素)
div: empty{
width: 30px;
height: 30px;
background-color: red;
}
--------------------------
<div></div>
5、UI元素状态伪类
:enable 选择可用表单元素
:disable 选择禁用表单元素
:checked 选择被选中的表单元素
:root 选择文档的根元素,等同于html元素
:target 选取活动的目标元素
:after 在元素内部最前添加内容
:before 在元素内部最后添加内容
p:nth-child(n) 选择其父元素的第N个 刚好是p的元素
p:nth-last-child(n) ..............................................从最后一个子元素开始计数
p:nth-of-type(n) 选择其父元素的n个元素
p:nth-last-of-type(n) ........................从最后一个子元素开始计数
p:last-of-type 选择其父元素的最后的一个P元素
p:last-child 选择其父元素的最后子元素(一定是P才行)
p:first-of-type 选择其父元素的首个P元素
p:first-child 选择其父元素的首个p元素(一定是p才行)
p:only-child 选择其父元素的只有一个元素(而且这个元素只能是p元素,不能有其他元素)
p:only-of-type 选择其父元素的只有一个p元素(不能有第二个P元素,其他元素可以有)