本節(jié)大綱
- 章節(jié)4列表標(biāo)簽
- 課時(shí)30無序列表(掌握)
- 課時(shí)31無序列表練習(xí)(理解)
- 課時(shí)32無序列表練習(xí)2(理解)
- 課時(shí)33無序列表練習(xí)3(理解)
- 課時(shí)34有序列表(理解)
- 課時(shí)35定義列表(掌握)
- 課時(shí)36定義列表練習(xí)(了解)
列表
給一堆數(shù)據(jù)添加列表語義
在HTML中列表的分類：
- 無序列表(unorderde list) （最常用）
- 有序列表(ordered list) （最不常用）
- 定義列表(definition list) （較少用）
無序列表<ul>
無序列表作用
為一堆數(shù)據(jù)添加列表語義，這堆數(shù)據(jù)沒有先后之分
- 例如排行榜涕侈，就是有序列表贡羔；例如中國城市列表就是無序列表
無序列表格式格式
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>5551</li>
</ul>
li就是list item的縮寫疚察，也就是列表?xiàng)l目的意思
注意點(diǎn)：
- ul標(biāo)簽是給一堆數(shù)據(jù)添加列表語義的，而不是給他們添加小圓點(diǎn)的
- ul和li都是整體的婶肩，是一個(gè)組合，他倆都是一起出現(xiàn)的，不會的的那個(gè)出現(xiàn)
- 因?yàn)閡l和li都是一個(gè)組合出現(xiàn)昙啄，不建議ul內(nèi)添加其他標(biāo)簽
無序列表應(yīng)用場景
- 新聞列表
- 商品列表
- 導(dǎo)航條
例子；ch031-uncordered-list.html
一些雜項(xiàng)
- ul和li都是一起的寸五，成雙成對的梳凛，但ul中不要有其他東西，li卻可以加各種各樣的標(biāo)簽梳杏，而且li中還可再套一個(gè)ul
有序列表<ol>
為一對數(shù)據(jù)添加列表語義韧拒，但其中的數(shù)據(jù)是有先后之分的
有序列表的格式
<ol>
<li>No.1</li>
<li>No.2</li>
<li>No.3</li>
</ol>
Ps: ol>li*4 快速生成4個(gè)ol的li
定義列表<dl>
格式
<dl>
<dt>北京</dt>
<dd>中國的首都</dd>
<dt>上海</dt>
<dd>富人集中地</dd>
<dt>山東</dt>
<dd>喝酒大省十性！</dd>
</dl>
- dt:definition title縮寫叛溢，定義標(biāo)題
- dd；definition description縮寫烁试，定義標(biāo)題定義的描述的
先通過dt標(biāo)題定義標(biāo)題雇初，dd就描述一下標(biāo)題
定義列表的作用
- 定義網(wǎng)站底部的相關(guān)信息
- 做圖文混排
定義列表的注意點(diǎn)
- 和ul/ol一樣，dl和dt/dd都是整體出現(xiàn)的
- 和ul/ol一樣减响，dl內(nèi)不建議出現(xiàn)其它標(biāo)簽靖诗，當(dāng)需要豐富頁面的時(shí)候郭怪，dt/dd內(nèi)可以加各種各樣的標(biāo)簽
- 可以沒有dd或者由多個(gè)dd，但僅推薦一個(gè)dt對應(yīng)一個(gè)dd
