list-style-type的使用，除去列表的默认属性type

最新推荐文章于 2023-08-13 10:29:07 发布

子夜时辰

最新推荐文章于 2023-08-13 10:29:07 发布

阅读量296

点赞数

分类专栏： css 文章标签：前端 html css

本文链接：https://blog.csdn.net/m0_56132701/article/details/129143615

版权

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

有关列表项符号：list-style-type

list-style-type:取值

说明

list-style-type属性是针对ol和ul元素的，而不是li元素。其中，list-style-type属性取值如下表

表1 ol的list-style-type属性取值

属性值	说明
decimal	阿拉伯数字：1，2，3(默认值)
lower-roman	小写罗马数字：i,ii,iii…
upper-roman	大写罗马数字：I,II,III…
lower-alpha	小写英文字母：a,b,c…
upper-alpha	大写英文字母：A,B,C…

表2 ul的list-style-type属性取值

属性值	说明
disc	实心圆●（默认值）
cicle	空心圆○
square	正方形■

例子：

![Snipaste_2023-02-21_15-21-05](C:\Users\123\Desktop\Snipaste_2023-02-21_15-21-05.png)    <title>表格</title>
    <style>
        ol{
            list-style-type: lower-roman;
        }
    </style>
</head>
<body>    
    <ol>
        <li>大西</li>
        <li>大北</li>
        <li>大南</li>
        <li>大东</li>
    </ol>

在这里插入图片描述

    <title>表格</title>
    <style>
        ul{
            list-style-type: square;
        }
    </style>
</head>
<body>    
    <ul>
        <li>金</li>
        <li>木</li>
        <li>水</li>
        <li>火</li>
        <li>土</li>
    </ul>

在这里插入图片描述

在css中我们会使用list-style-type属性来除去有序列表或无序列表的列表项符号的。

list-style-type:none

子夜时辰

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
list-style-type的使用，除去列表的默认属性type

list-style-type属性是针对ol和ul元素的，而不是li元素。其中，list-style-type属性取值如下表。在css中我们会使用list-style-type属性来除去有序列表或无序列表的列表项符号的。表1 ol的list-style-type属性取值。表2 ul的list-style-type属性取值。
复制链接

扫一扫