这里写目录标题
- 一、:has
- 获取第一个div
- 获取包含 a.active 的 li
- 获取第二个div
- 二、:not
- 除了类名为active 的 a,其他的a的字体都为18px
<div>
<h1>标题</h1>
</div>
<div>
<ul>
<li>
<a href="#" class="active">测试1</a>
</li>
<li>
<a href="#">测试2</a>
</li>
</ul>
</div>
<h2>4444</h2>
一、:has
- :has伪类接受一个选择器组作为参数
获取第一个div
div:has(h1){
background-color:red;
}
获取包含 a.active 的 li
li:has(> a.active){
color:red;
}
获取第二个div
- :has() 父选择器支持 同级结构的兄元素选择
div:has(+ h2) {
margin-left: 24px;
border: 1px solid #000;
}
二、:not
- :not的作用是防止特定的元素被选中，也被称为反选伪类
除了类名为active 的 a,其他的a的字体都为18px
a:not(.active){
font-size:18px;
}
最后，如果能帮到你
