無序列表,用來表示乙個列表的語義,並且每個專案和每個專案之間,是不分先後的。
ul就是英語unorderedlist,「無序列表」的意思。
li 就是英語listitem , 「列表項」的意思。
1
也就是說,所以的li不能單獨存在,必須包裹在ul裡面;反過來說,ul的「兒子」不能是別的東西,只能有li。
下面的是錯誤的,因為必須用ul包裹:
7 北京
8 上海
9 廣州
10 鐵嶺
下面的也是錯誤的,因為ul裡面只能有li標籤,而不能有別的:
1
瀏覽器會預設的給無序列表小圓點的「先導符號」
但是,再次強調,ul的作用,並不是給文字增加小圓點的,而是增加無序列表的「語義」的。
ul標籤實際應用場景:
ul的兒子,只能是li。但是li是乙個容器級標籤,li裡面什麼都能放,比如:
1
甚至於可以再放乙個ul:
1
27
28
4
5
6 用的
7
11
12
13 喝的
14
18
19
orderedlist 有序列表,用ol表示
1
2 小蘋果
3 月亮之上
4 最炫民族風
5
瀏覽器會自動增加阿拉伯序號:
也就是說,ol和ul就是語義不一樣,怎麼使用都是一樣的。
ol裡面只能有li,li必須被ol包裹。li是容器級。
1
定義列表也是乙個組標籤,不過比較複雜,出現了三個標籤:
dl表示definition list 定義列表
dt表示definition title 定義標題
dd表示definition description 定義表述詞兒
dt、dd只能在dl裡面;dl裡面只能有dt、dd
1
2北京
3國家首都,政治文化中心
4上海
5魔都,有外灘、東方明珠塔、黃浦江
6廣州
7中國南大門,有珠江、小蠻腰
8
表達的語義是兩層:
1) 是乙個列表,列出了北京、上海、廣州三個專案
2)每乙個詞兒都有自己的描述項。
dd是描述dt的。
定義列表用法非常靈活,可以乙個dt配很多dd:
1
2 北京
3 國家首都,政治文化中心
4 汙染很嚴重,pm2.0天天報表
5 上海
6 魔都,有外灘、東方明珠塔、黃浦江
7 廣州
8 中國南大門,有珠江、小蠻腰
9
北京這個專案,用了兩個dd來描述。
還可以拆開,讓每乙個dl裡面只有乙個dt和dd,這樣子感覺清晰一些。
1
2 北京
3 國家首都,政治文化中心
4 汙染很嚴重,pm2.0天天報表
5
6
7
8 上海
9 魔都,有外灘、東方明珠塔、黃浦江
10
11
12
13 廣州
14 中國南大門,有珠江、小蠻腰
15
真實案例:
結構:1
2 購物指南
3
4 購物流程
5 會員介紹
6 生活旅行/**
7 常見問題
8 大家電
9 聯絡客服
10
11
12
13 配送方式
14
15 上門自提
16 211限時達
17 配送服務查詢
18 配送費收取標準
19 海外配送
20
21
CSS學習之 列表
1 列表型別 語法 li 屬性值列表值描述 none 無標記。disc 預設。標記是實心圓。circle 標記是空心圓。square 標記是實心方塊。decimal 標記是數字。decimal leading zero 0開頭的數字標記。01,02,03,等。lower roman 小寫羅馬數字 i...
python之列表操作
列表操作功能彙總 print 列表操作功能彙總 list demo first second thrid fourth 複製list demo列表取名list list list demo print 原列表為 list print print 輸出列表第乙個元素 list 0 print 輸出列表...
HTML資料之列表
無序列表 格式 type 無序列表前的標記 square 小方塊 disc 實心小圓圈,預設 circle 空心小圓圈 注 一般設定列表樣式,不直接在type屬性中設定,都是通過css來設定。示例 type square 紙上得來終覺淺li 絕知此事要躬行li ul 效果圖 有序列表 格式 列表項 ...