HTML 5 详解之列表标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表标签学习</title>
</head>
<body>

<!--
有序列表:
样例如下:
1. java
2. python
3. 运维
4. 前端
5. C/C++
应用范围:试卷/问答...
-->
<ol>
    <li>java</li>
    <li>python</li>
    <li>运维</li>
    <li>前端</li>
    <li>C/C++</li>
</ol>

<hr/>

<!--
无序列表:
样例如下:
· java
· python
· 运维
· 前端
· C/C++
应用范围:导航/侧边栏...
-->
<ul>
    <li>java</li>
    <li>python</li>
    <li>运维</li>
    <li>前端</li>
    <li>C/C++</li>
</ul>

<hr/>

<!--
自定义列表:
dl:标签
dt:列表名称
dd:列表内容
应用范围:公司网站底部
样例如下:
学科
    java
    python
    Linux
    C
位置
    西安
    重庆
    新疆
-->
<dl>
    <dt>学科</dt>
    <dd>java</dd>
    <dd>python</dd>
    <dd>Linux</dd>
    <dd>C</dd>

    <dt>位置</dt>
    <dd>西安</dd>
    <dd>重庆</dd>
    <dd>新疆</dd>
</dl>

</body>
</html>

 

posted @ 2021-02-03 15:41  无明之辈  阅读(82)  评论(0编辑  收藏  举报