溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

HTML5列表

發(fā)布時間：2020-07-22 21:07:51 來源：網(wǎng)絡(luò) 閱讀：252 作者：yeleven 欄目：移動開發(fā)

HTML列表

    <ol>    有序列表

    <ul>    無序列表

    <li>    列表項

     ---------------------

    <dl>    列表

    <dt>    列表項

    <dd>    描述

    1.無序列表

        使用標(biāo)簽：<ul><li>

        屬性：disc、circle、square

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（默認(rèn)方式--disc）實體的圓</title>
</head>
<body>
    <ul type="disc">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ul>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（circle）空心圓</title>
</head>
<body>
    <ul type="circle">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ul>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（square）實體方塊</title>
</head>
<body>
    <ul type="square">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ul>
</body>
</html>

    2.有序列表

        使用標(biāo)簽：<ol><li>

        屬性：A、a、I、i、start

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（A）大寫字母ABC……</title>
</head>
<body>
    <ol type="A">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ol>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（a）小寫字母abc……</title>
</head>
<body>
    <ol type="a">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ol>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（I）I II III……</title>
</head>
<body>
    <ol type="I">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ol>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（i）i ii iii……</title>
</head>
<body>
    <ol type="i">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ol>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>（屬性改為start，從10開始）10 11 12……</title>
</head>
<body>
    <ol start="10">
        <li>ios</li>
        <li>android</li>
        <li>html5</li>
        <li>swift</li>
    </ol>
</body>
</html>

    3.嵌套列表

        使用標(biāo)簽：<ul><ol><li>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>無序的嵌套列表</title>
</head>
<body>
    <ul>
        <li>寵物</li>
            <ul>
                <li>貓</li>
                <li>狗</li>
            </ul>
        <li>人類</li>
            <ul>
                <li>英國人</li>
                <li>中國人</li>
            </ul>
        <li>植物</li>
            <ul>
                 <li>吊蘭</li>
                <li>牡丹</li>
             </ul>
    </ul>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有序的嵌套列表</title>
</head>
<body>
    <ol>
        <li>寵物</li>
            <ol>
                <li>貓</li>
                <li>狗</li>
            </ol>
        <li>人類</li>
            <ol>
                <li>英國人</li>
                <li>中國人</li>
            </ol>
        <li>植物</li>
            <ol>
                 <li>吊蘭</li>
                <li>牡丹</li>
             </ol>
    </ol>
</body>
</html>

    4.自定義列表

        使用標(biāo)簽：<dl><dt><dd>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自定義列表</title>
</head>
<body>
    <dl>
        <dt>HelloWorld</dt>
            <dd>aaa</dd>
        <dt>HelloWorld</dt>
        <dd>aaa</dd>
        <dt>HelloWorld</dt>
        <dd>aaa</dd>
    </dl>
</body>
</html>
向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手