有序列表和無序列表、定義列表
阿新 • • 發佈:2021-06-30
<!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 之間可以相互巢狀