这里写目录标题
- 一、: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;}
最后,如果能帮到你