html+css中最后一个li没有竖线

先放效果：

我们经常会遇到这种情况，总是不知道怎么弄。

先来说说竖线：
其实竖线有很多种写法，你可以用li标签的border-right，可以把竖线也当做一个li，还可以用li的after伪元素。

而如果想要第一个或最后一个li没有竖线效果，之前经常用的就是给其他的li单独设置class规定样式，现在有一个更好的办法。
css中的:not()选择器。

            &:not(:last-child)::after {
                content: "";
                background-color: #cccccc;
                height: 15px;
                width: 1px;
                position: absolute;
                top: 8px;
                right: 0px;
                display: block;
            }

上述代码的意思就是不包括最后一个子节点