闲暇时间学习学习HTML相关知识————HTML列表！

HTML 列表

有序列表　　　<ol>
无序列表　　　<ul>
列表项　　　　<li>
列表　　　　　<dl>
列表项　　　　<dt>
描述　　　　　<dd>

示例

1
2
3
4
5
6
7
8
9
10
11
12
13
<body>
    <ul>
        <li>apple</li>
        <li>htc</li>
        <li>sc</li>
    </ul>
    
    <ol>
        <li>apple</li>
        <li>htc</li>
        <li>sc</li>
    </ol>
<body>

分类

  1. 无序列表
    使用标签：<ul>、<li>
    属性：disc、circle、square

    1
    2
    3
    4
    5
    6
    <!--type取值 disc:实心圆 circle:空心圆 square：实心方块 -->
    <ul type="disc">
        <li>apple</li>
        <li>htc</li>
        <li>sc</li>
    <ul>

  2. 有序列表
    使用标签：<ol>/<li>
    属性：A、a、l、i、start (type取值)

    1
    2
    3
    4
    5
    <ol type="A">
        <li>apple</li>
        <li>htc</li>
        <li>sc</li>
    </ol>

  3. 嵌套列表
    使用标签：<ul>/<ol>/<li>

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    <ul type="disc">
        <li>动物</li>
            <ul>
                <li>狗</li>
                <li>猫</li>
            </ul>
        <li>植物</li>
            <ul>
                <li>草</li>
                <li>花</li>
            </ul>
    <ul>

  4. 自定义列表
    使用标签：<dl>/<dt>/<dd>

    1
    2
    3
    4
    5
    6
    <dl>
        <dt>Hello</dt>
            <dd>描述一</dd>
        <dt>World</dt>
            <dd>描述二</dd>
    </dl>

最后更新： 2018年09月26日 11:32

原始链接： http://yoursite.com/2015/02/06/HTML5/HTML列表属性/

赏
× 请我吃糖~
打赏二维码