zoukankan      html  css  js  c++  java
  • 学习笔记:HTML列表

    HTML支持有序、无序和自定义列表

    有序列表:

    1. 第一个列表项
    2. 第二个列表项
    3. 第三个列表项

    无序列表:

    • 列表项
    • 列表项
    • 列表项

    1、无序列表

    无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。

    标签:<ul>

    <ul>
    <li>Coffee</li>
    <li>Milk</li>
    </ul>

    浏览器显示如下 

    2、有序列表

    有序列表也是一列项目,用数字进行标记,这个好像在学MarkDown的时候学的

    标签:<ol>

    <ol>
    <li>Coffee</li>
    <li>Milk</li>
    </ol>

    3、自定义列表

    自定义列表不仅仅是一列项目,而是项目及其注释的组合。

    自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

    <dl>
    <dt>Coffee</dt>
    <dd>- black hot drink</dd>
    <dt>Milk</dt>
    <dd>- white cold drink</dd>
    </dl>
    
    

    浏览器显示如下:

    Coffee
    - black hot drink
    Milk
    - white cold drink

    4、嵌套列表

    <!DOCTYPE html>
    <html>
    <head> 
    <meta charset="utf-8"> 
    <title>菜鸟教程(runoob.com)</title> 
    </head>
    <body>
    
    <h4>嵌套列表:</h4>
    <ul>
      <li>Coffee</li>
      <li>Tea
        <ul>
          <li>Black tea</li>
          <li>Green tea
            <ul>
              <li>China</li>
              <li>Africa</li>
            </ul>
          </li>
        </ul>
      </li>
      <li>Milk</li>
    </ul>
    
    </body>
    </html>

    结果:

    列表标签汇总

    标签 描述
    <ol> 定义有序列表
    <ul> 定义无序列表
    <li> 定义列表项
    <dl> 定义列表
    <dt> 自定义列表项目
    <dd> 定义自定列表项的描述
  • 相关阅读:
    运算符和结合性
    几种排序算法 C++
    UNIX环境高级编程笔记
    几个C语言题与答案
    视频流中的DTS/PTS到底是什么 转载
    linux硬链接与软链接 转载
    HTTP POST上传文件(wininet实现)
    并查集(求最小生成树和集团问题)
    c++ vector
    C++STL priority_queue类
  • 原文地址:https://www.cnblogs.com/coding365/p/12872208.html
Copyright © 2011-2022 走看看