一、列表的种类

在HTML中一共有三种列表的表现形式，我们来看一下，具体长什么样子呢？

1.无序列表（ul）

使用ul标签来创建
使用li标签来创建列表项

2.有序列表(ol)

使用ol标签来创建
使用li标签来创建列表项

3.定义列表(dl)

使用dl来创建一个定义列表
使用dt来定义其中的内容
使用dd进行解释说明

列表之间可以嵌套

二、代码

(1) 使用方法

<ul>
         <li>结构</li>
         <li>表现</li>
         <li>行为</li>
</ul>
<ol>
        <li>结构1</li>
        <li>表现2</li>
        <li>行为3</li>
</ol>
<dl>
         <dt>结构</dt>
         <dd>结构用来表示网页的结构，结构用来表示规定哪里是标题，哪里是强调</dd>
         <dt>表现</dt>
         <dd>表现用来表示网页的渲染，表现可以告诉浏览器怎么显示</dd>
</dl>

(2) 测试一下(可以先想想看是什么效果呢？)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>列表</title>
</head>
<body>
     <ul>
         <li>结构</li>
         <li>表现</li>
         <li>行为</li>
     </ul>
     <ol>
        <li>结构1</li>
        <li>表现2</li>
        <li>行为3</li>
     </ol>
     <dl>
         <dt>结构</dt>
         <dd>结构用来表示网页的结构，结构用来表示规定哪里是标题，哪里是强调</dd>
         <dt>表现</dt>
         <dd>表现用来表示网页的渲染，表现可以告诉浏览器怎么显示</dd>
     </dl>

     <ul>
         <li>ONE
             <ul>
                <li>one
                    <ul>
                        <li>1.null</li>
                        <li>2.null</li>
                        <li>3.null</li>
                     </ul>
                </li>
                <li>two
                    <ul>
                        <li>1.null</li>
                        <li>2.null</li>
                        <li>3.null</li>
                     </ul>
                </li>
                <li>three
                    <ul>
                        <li>1.null</li>
                        <li>2.null</li>
                        <li>3.null</li>
                     </ul>
                </li>
             </ul>
         </li>
         <li>TWO
            <UL>
                <li>one</li>
                <li>two</li>
                <li>three</li>
            </UL>
         </li>
     </ul>
     
</body>
</html>

7.jpg