not(:last-child)的用法

mini_qiu

于 2020-01-02 10:59:32 发布

阅读量9.3k

点赞数

分类专栏： HTML 前端 CSS 文章标签： not(:last-child)

本文链接：https://blog.csdn.net/mini_1251861209/article/details/103800741

版权

前端同时被 3 个专栏收录

44 篇文章

订阅专栏

CSS

19 篇文章

订阅专栏

HTML

13 篇文章

订阅专栏

网上看资料时看到的用法，以前没接触过，看到之后不禁感叹这用法太人性化了，极大方便了敲代码：

<style>
    ul{
        list-style: none;
    }
    li{
        display: inline;
    }
    li:not(:last-child)::after{
        content: "|";
    }
</style>
<nav>
    <ul>
        <li>HTML 5</li>
        <li>CSS3</li>
        <li>JavaScript</li>
    </ul>
</nav>

实现效果：