首页 > 其他 > 详细

列表li利用before显示有序号数字

时间:2021-05-28 14:48:20      阅读:20      评论:0      收藏:0      [点我收藏+]
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
      
        li{
            list-style: none; /*影藏li前面的圆点*/
            counter-increment: number; /* ① 有序数字*/
        }
        li::before{
            content: counter(number); /* ② li前面显示数字,*/
        }
        /* ① 和 ②得单独分开,不然数字全是一样的 */

    </style>
</head>
<body>
<ul>
    <li>设计</li>
    <li>开发</li>
    <li>测试</li>
    <li>运营</li>
</ul>
</body>
</html>

 

列表li利用before显示有序号数字

原文:https://www.cnblogs.com/qq321722956/p/14821585.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!