第二十九課 無序列表
列表標簽：給一堆數(shù)據(jù)添加列表語義丑念，表示這一堆數(shù)據(jù)是一個整體
分類：
無序列表（最多）（unordered list）
有序列表（最少）(ordered list)
定義列表（其次） （definition list)
無序列表:給一堆數(shù)據(jù)添加列表語義碴里，并且這一堆數(shù)據(jù)中所有的數(shù)據(jù)都沒有先后之分
格式：
<ul>
<li> list item 1 </li>
</ul>
注意點：
1、無序列表是給一堆數(shù)據(jù)添加列表語義的化借，告訴瀏覽器這一堆數(shù)據(jù)是一個整體，不是添加小圓點的眷柔，小圓點css修改樣式
2糟趾、ul和li標簽是一個整體，是一個組合休雌，不會單獨使用
3灶壶、ul標簽中不推薦添加除li標簽以外的標簽
應用：
1、新聞列表
2杈曲、商品列表
3驰凛、導航條 css修改樣式
<h2>列表</h2>
<ul>
<li> list item1 </li>
<li> list item2 </li>
<li> list item3 </li>
</ul>
第三十課 無序列表練習
<h2>搜狐新聞類標</h2>
<!--雖然通過標簽可以修改樣式，但是在企業(yè)開發(fā)中不建議使用 -->
<hr width="500px" align="left">
<ul type="circle">
<li>list item1</li>
<li>list item2</li>
<li>list item3</li>
<li>list item4</li>
<li>list item5</li>
</ul>
第三十一課 無序列表練習 2
<!--ul標簽中只能放li標簽担扑，但是li中可以放其他標簽 -->
<h2>四大名著</h2>
<ul>
<li>
<h3>《三國演員》</h3>
<p>三國鼎立</p>
</li>
<li>
<h3>《西游記》</h3>
<p>孫悟空</p>
</li>
<li>
<h3>《水滸傳》</h3>
<p>武松</p>
</li>
<li>
<h3>《紅樓夢》</h3>
<p>賈寶玉</p>
</li>
</ul>
第三十二課 無序列表練習 3
<!-- 無序列表中l(wèi)i標簽中可以添加ul標簽恰响，ul中只能有l(wèi)i -->
<h2>物品清單</h2>
<ul>
<li>
<h3>蔬菜</h3>
<ul>
<li>白菜</li>
<li>蘿卜</li>
<li>黃瓜</li>
</ul>
</li>
<li>
<h3>水果</h3>
<ul>
<li>蘋果</li>
<li>西瓜</li>
<li>香蕉</li>
</ul>
</li>
</ul>
webstorm 快捷方式
ul>li；ul>li*3
<ul>
<li></li>
</ul>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
ul>li2>h2+ul>li3
<ul>
<li>
<h2></h2>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
<li>
<h2></h2>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</li>
</ul>
第三十三課 有序列表
有序列表:給一堆數(shù)據(jù)添加列表語義涌献，并且這一堆數(shù)據(jù)中所有的數(shù)據(jù)都有先后之分
其他和ul一樣
<ol>
<li> list item </li>
</ol>
<ol type="a">
<li>演員</li>
<li>丑八怪</li>
<li>一人飲酒醉</li>
</ol>
第三十四課 定義列表
1胚宦、給一堆數(shù)據(jù)添加列表語義
2、dt標題 dd標題描述
格式：
<dl>
<dt></dt>
<dd></dd>
<dt></dt>
<dd></dd>
</dl>
dt:definition title 定義列表中的標題
dd:definition description 定義標題對應的描述的
注意點
1 dl和dt/dd是一個整體洁奈，一次出現(xiàn)
2 dl中建議只放dt和dd標簽
3 一個dt可以沒有對應的dd间唉，也可以沒有dd绞灼，但是不建議使用
建議使用一個dt對應一個dd
4 和li標簽一樣利术，當豐富界面時，可以在dt和dd標簽中繼續(xù)添加其他標簽
應用場景：
1低矮、做網(wǎng)站尾部的相關信息
2印叁、做圖文混排
<dl>
<dt>北京</dt>
<dd>中國的首都</dd>
<dt>上海</dt>
<dd>富人聚集地</dd>
</dl>
第三十五課 定義列表練習
和li標簽一樣，當豐富界面時，可以在dt和dd標簽中繼續(xù)添加其他標簽
<!--和li標簽一樣轮蜕，當豐富界面時昨悼，可以在dt和dd標簽中繼續(xù)添加其他標簽-->
<!--dl>dt+dd-->
<dl>
<dt>
</dt>
<dd>
<h2>圖片</h2>
<p>圖片很好看</p>
</dd>
</dl>
<!-- 定義列表 -->
<dl>
<dt dir="rtl">購物指南</dt>
<dd>
<a href="#">購物指南</a>
<a href="#">會員介紹</a>
<a href="#">生活旅行／團購</a>
<a href="#">常見問題</a>
<a href="#">大家電</a>
<a href="#">聯(lián)系客服</a>
</dd>
</dl>
