美文网首页前端基础学习
html基础标签——ul、ol和dl

html基础标签——ul、ol和dl

作者: LeslieFind | 来源:发表于2020-05-07 18:15 被阅读0次

    效果展示:

    image.png

    代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <!--   ul:生成无序的   -->
        <h4>ul:生成无序的</h4>
        <ul>
            <li>111</li>
            <li>111</li>
            <li>111</li>
            <li>111</li>
        </ul>
        <hr/>
    
        <!--  ol:带序号的  -->
        <h4>ol:带序号的</h4>
        <ol>
            <li>111</li>
            <li>222</li>
            <li>333</li>
            <li>444</li>
        </ol>
        <hr/>
    
        <!--   dl:自定义列表     -->
        <h4>dl:自定义的</h4>
        <dl>
            <dt>一级</dt>
                <dd>11</dd>
                <dd>22</dd>
                <dd>33</dd>
            <dt>33</dt>
                <dd>55</dd>
        </dl>
    </body>
    </html>
    

    总结:

    1、ul(unordered lists):无序列表,内容用li(list item)
    2、ol(ordered lists):有序列表,内容用li(list item)
    3、dl(defined lists):定义列表,里面需要2个,分别是dt和dd
    3.1、dt(definition term)自定义列表组(我理解的是大标题);
    3.2、dd(definition description)自定义列表描述(大标题底下罗列的内容)

    相关文章

      网友评论

        本文标题:html基础标签——ul、ol和dl

        本文链接:https://www.haomeiwen.com/subject/lefzghtx.html