在下面的结构中,li 元素之间插入一条分割线:
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
首先可以利用:nth-child()选择器选择 tail 部分,然后在 tail 里的每个 li 加上一个::before 元素,给伪元素设置 border-bottom 实现分割线。代码如下:
li:nth-child(n + 2)::before {
content: " ";
display: block;
border-bottom: 1px solid black;
}