CSS核心属性-列表属性

最新推荐文章于 2023-11-18 07:46:28 发布

房东的喵

最新推荐文章于 2023-11-18 07:46:28 发布

阅读量187

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/luxunlx123/article/details/105844132

版权

前端专栏收录该内容

30 篇文章 0 订阅

订阅专栏

列表属性：

语法：
{list-style-type: circle（空心圆）/disc（实心圆）/square（实心方块）/none（去掉列表符号）；}
说明：
定义列表符号样式

语法：
{list-type-image:url（所使用图片的路径以及全称）；}
说明：
使用图片作为列表符号

语法：
{list=type=position:outside(外边)/inside(里边)；}
说明：
定义列表符号位置

语法：
{list-type:none;}
说明：
去掉列表样式

例：
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
        .u1 li {list-style-type: circle;}
        .u2 li {list-style-image: url(7.jpg)};
        .u3  {border: 1px #000 solid;}
        .u3 li {border: 1px #f00 solid; list-style-position: inside; }
        .u4 li {list-style: none;}
        </style>
    </head>
    <body>
        <ul class="u1">
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
        </ul>
        <ul class="u2">
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
        </ul>
        <ul class="u3">
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
        </ul>
        <ul class="u4">
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
            <li>西安邮电大学</li>
        </ul>
    </body>
</html>

房东的喵

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS核心属性-列表属性

列表属性：语法：{list-style-type: circle（空心圆）/disc（实心圆）/square（实心方块）/none（去掉列表符号）；}说明：定义列表符号样式语法：{list-type-image:url（所使用图片的路径以及全称）；}说明：使用图片作为列表符号语法：{list=type=position:outside(外边)/inside(里边)；}说...
复制链接

扫一扫

专栏目录