文章目录
- 前言
- html
- 一、选择第一个元素
- 二、选择最后一个元素
前言
区分class,选择第一个或者最后一个元素。
如果不区分class,可以使用 first-child或者last-child等;
html
<div class="a">
<div class="b">1</div>
<div class="b">2</div>
<div class="c">3</div>
<div class="c">4</div>
<div class="c">5</div>
<div class="c">6</div>
<div class="d">d</div>
</div>
一、选择第一个元素
c是连续的可以 用+ 号,不连续的必须用~
.a .c:not(.c ~.c) {
color:red;
}
二、选择最后一个元素
.c:not(.a :has(+ .c)) {
color: blue;
}