1. 程式人生 > 其它 >有序列表和無序列表、定義列表

有序列表和無序列表、定義列表

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            /*
              去掉專案符號
            */
           /* ul{
               list-style: none;
           } */
        </style>
    </
head> <body> <!-- 三種列表 - 無序列表 - 有序列表 - 定義列表 --> <!-- 無序列表 - ul標籤建立 - 使用li在列表中建立項 通過type屬性可以修改列表的專案符號 值 disc 預設值 square 實心方塊 circle 空心圈 注意:預設專案符號我們一般不使用 若需要設定專案符號可採用為例設定背景圖片方式設定
--> <ul> <li>西門慶</li> <li>潘金蓮</li> <li>武大郎</li> </ul> <!-- 有序列表和無序類似 用ol代替ul 使用有序符號作為專案符號 type屬性可以指定序號的型別 值 - 預設 阿拉伯數字 - a/A 英文字母 - I/i 羅馬數字 ol也是塊元素
--> <ol> <li>西門慶</li> <li>武大郎</li> <li>潘金蓮</li> </ol> <!-- 列表之間可以互相巢狀,在無序中方有序,有序中放無序 --> <p>菜譜</p> <ul> <li> 魚肉 <ol> <li></li> <li>肉絲</li> </ol> </li> <li>雞丁</li> <li>肉絲</li> </ul> </body> </html>

無序列表

<ul>

<li></li>

</ul>

有序列表

 

<ol>

<li></li>

</ol>

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <!-- 
            定義列表用來對一些詞彙或內容進行定義 
            dl 來建立一個定義列表 
                dl中有兩個子標籤
                        dt 被定義的內容
                        dd 對定義內容的描述
            同樣dl和ul和ol之間都可以相互巢狀
         -->
         <dl>
             <dt>潘金蓮</dt>
             <dd>下毒整死武大郎</dd>
             <dd>下毒整死武大郎</dd>
         </dl>
         
    </body>
</html>

定義列表

dl建立定義列表

dl中有兩個子標籤

    dt 被定義的內容

     dd 對定義內容的描述

dl ul ol 之間可以相互巢狀