美文网首页
一个比较棒的html列表自定义方式

一个比较棒的html列表自定义方式

作者: BGBM | 来源:发表于2018-08-13 23:16 被阅读0次

    Q:怎么在网页中用 ol 标签 + css 做出如图所示的列表项?求解!

    怎么在网页中用 ol 标签 + css 做出如图所示的列表项?求解!.jpg

    A:如下所示

    <!DOCTYPE>
    <html>
    <head>
        <style>
        ol {counter-reset:lt}
        li {list-style:none;}
        li::before{content:"("counter(lt)")"; counter-increment:lt 1; }
        </style>
    </head>
    <body>
    <ol> 
        <li>新歌top100</li> 
        <li>新曲top500</li> 
        <li>中文金曲榜</li> 
    </ol>
    </body>
    </html>
    

    来源:https://zhidao.baidu.com/question/452557735.html
    注意:有的浏览器估计不支持。

    相关文章

      网友评论

          本文标题:一个比较棒的html列表自定义方式

          本文链接:https://www.haomeiwen.com/subject/mvvpbftx.html