Day4无序，有序和定义列表

无序列表，在实际应用中，无序列表应用的最为广泛
image

<!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>列表条目三</li>
        <li>列表条目四</li>
    </ul>
    
</body>
</html>

image

有序列表
其与无序列表的差异在于会自发的为每行li标上序号
image

<!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>
    <ol>
        <li>目录1</li>
        <li>目录2</li>
        <li>目录3</li>
    </ol>
</body>
</html>

image

定义列表
image

<!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>
    <dl>
        <dt>服务中心</dt>
        <dd>售后保险</dd>
        <dd>申请售后</dd>


    </dl>
    
</body>
</html>

image

posted @ 2025-10-25 15:17  冰涿  阅读(16)  评论(0)    收藏  举报