1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <title>Title</title>
    6. </head>
    7. <body>
    8. <!--title-->
    9. <!--无序列表  ul-li
    10. 导航
    11. 侧边栏新闻
    12. 在文章中，一般会使用它来排列
    13. -->
    14. <ul>
    15.     <li>语文</li>
    16.     <li>数学</li>
    17.     <li>英语</li>
    18.     <li>Java</li>
    19. </ul>
    21. <hr>
    23. <!--有序列表 ol-li
    24. 问答试卷、测试题....卷子，或者需要排序的。微博热搜，榜单
    25. -->
    26. <ol>
    27.     <li>java</li>
    28.     <li>c++</li>
    29.     <li>python</li>
    30.     <li>servlet</li>
    31. </ol>
    33. <hr>
    35. <!--自定义列表
    36. 网站的底部，用于标记项
    37. dl：标签
    38. dt：列表名称
    39. dd：列表内容
    40. -->
    41. <dl>
    42.     <dt>水果</dt>
    43.     <dd>苹果</dd>
    44.     <dd>梨子</dd>
    45.     <dd>香蕉</dd>
    46.     <dd>葡萄</dd>
    47.     <dt>语言</dt>
    48.     <dd>中文</dd>
    49.     <dd>英语</dd>
    50.     <dd>发法语</dd>
    51.     <dd>葡萄语</dd>
    52. </dl>
    55. </body>
    56. </html>

    运行结果：
    image.png