HTML列表相关知识（第六课）

五寸执念*

于 2024-09-25 22:12:20 发布

阅读量240

点赞数 3

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

本文链接：https://blog.csdn.net/2302_76722613/article/details/142533599

版权

8 篇文章 0 订阅

订阅专栏

列表是用来布局的，可以让也页面更加整齐、有序，且其作为布局更加方便和自由

列表类型

<ul>标签表示HTML页面中项目的无序列表，一般会以项目符号呈现列表项

每个列表项是通过<li>标签来定义的

语法格式：

<body>
    <ul>
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
    </ul>
</body>

ps：①无序列表各个列表项之间没有顺序级别之分，是并列的

②<ul></ul>只能嵌套<li></li>，直接在<ul></ul>中输入其他文字或者标签是不被允许的

③<li></li>是一个容器，可以容纳所有元素，故可以在<li></li>中输入其他文字或者标签

例：

<body>
    <ul>
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
        <li><p>hahahah</p></li>
    </ul>
</body>

<ol>标签表示HTML页面中项目的有序列表，列表排序以数字来显示

每个列表项是通过<li>标签来定义的

语法格式：

<body>
    <ol>
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
    </ol>
</body>

ps：①无序列表各个列表项之间有顺序级别之分，不是并列的

②<ol></ol>只能嵌套<li></li>，直接在<ol></ol>中输入其他文字或者标签是不被允许的

③<li></li>是一个容器，可以容纳所有元素，故可以在<li></li>中输入其他文字或者标签

例：

<body>
    <ol>
        <li>列表项1</li>
        <li>列表项2</li>
        <li>列表项3</li>
        <li><p>hahahah</p></li>
    </ol>
</body>

使用场景：常用于对术语或者名词进行解释和描述，定义列表项没有任何项目符号，即

语法格式：

<body>
    <dl>
        <dt>名词1</dt>
        <dd>解释2</dd>
        <dd>解释3</dd>
        <dd>解释4</dd>
        <dd>解释5</dd>
    </dl>
</body>

ps：①<dl></dl>里面只能包含<dt>和<dd>

②<dt>和<dd>个数没有限制，但多数情况是一个<dt>对应多个<dd>

关注

专栏目录