简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Home
Article
Q&A
Course
Topic
Download
Game
Dictionary
Recent Updates

Home  >  Article  >  Web Front-end  >  H5 Learning Journey-H5 List (8)

H5 Learning Journey-H5 List (8)

黄舟
黄舟Original
2017-02-17 14:33:331479browse

Basic syntax of lists

ol: ordered list

ul: unordered list

li: list items

dl: List

dt: List item

dd: List description

Commonly used lists

1. Unordered list: Use tags ul, li attributes : disc (default solid circle) circle (empty circle) square (square)

2. Ordered list: use tags ol, li attributes: A (uppercase letters) a (lowercase letters) l (uppercase Roman numerals ) i (lowercase Roman numerals) start (set the starting Arabic numerals)

3. Mixed list: use tag ul ol li

4. Custom list: use tag dl dt dd

! ! ! ! ! ! Code example

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body>
   <ul type="square">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ul>
   <ol type="I">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ol>
   <ul type="square">
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
   </ul>
    <dl>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
    </dl></body></html>

Rendering

H5 Learning Journey-H5 List (8)

Basic syntax of the list

ol: ordered list

ul: Unordered list

li: List item

dl: List

dt: List item

dd: List description

Commonly used lists

1. Unordered list: use tags ul, li attributes: disc (default solid circle) circle (hollow circle) square (square)

2. Ordered list : Use tags ol, li Attributes: A (uppercase letters) a (lowercase letters) l (uppercase Roman numerals) i (lowercase Roman numerals) start (set starting Arabic numerals)

3. Mixed list: Use tags ul ol li

4. Customize the list: Use tags dl dt dd

! ! ! ! ! ! Code example

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>H5表格</title></head><body>
   <ul type="square">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ul>
   <ol type="I">
       <li>香蕉</li>
       <li>香蕉</li>
       <li>香蕉</li>
   </ol>
   <ul type="square">
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
       <li>香蕉</li>
       <ol>
           <li>水谷</li>
           <li>水谷</li>
       </ol>
   </ul>
    <dl>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
        <dt>hello world</dt>
        <dd>can you feel me</dd>
    </dl></body></html>

Rendering

H5 Learning Journey-H5 List (8)

The above is the content of the H5 learning journey-H5 list (8). For more related content, please pay attention to the PHP Chinese website (www.php.cn)!


Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：H5 Learning Journey-H5 Form (7)Next article：H5 Learning Journey-H5 Form (7)

Related articles

See more