HTML：列表元素_果仁雷爷

作者：凡人多烦事01 | 2024-03-28 09:00:36

踩

果仁雷爷

列表元素

有序列表

ol: ordered list

li：list item

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    把大象装冰箱，总共分几步？

<!--reversed表示倒序排列-->
    <ol reversed>
        <li>打开冰箱门</li>
        <li>大象进去</li>
        <li>冰箱门关上</li>
    </ol>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

无序列表

把ol改成ul

ul：unordered list

无序列表常用于制作菜单或新闻列表。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    xxx美女择偶条件：

    <ul>
        <li>有责任心</li>
        <li>会家务</li>
        <li>孝敬老人</li>
        <li>年薪30W</li>
    </ul>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

定义列表

通常用于一些术语的定义

dl: definition list 定义列表

dt: definition title 定义标题

dd: definition description 定义描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    HTML中的术语解释：

    <dl>
        <dt>HTML</dt>
        <dd>
            超文本标记语言，XXXXXX
        </dd>

        <dt>元素</dt>
        <dd>
            组成HTML文档的单元，每个xxxxx
        </dd>
    </dl>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/凡人多烦事01/article/detail/329059