一、列表

1.1無序列表

無序列表是用來表示一個列表的語義，並且每個專案和每個專案之間是不分先後的.

ul是英語uordered list“無序列表”的意思.

li是英語list item "列表項"的意思。

這是組標籤，要麼不寫，要麼就寫一組。

<ul>

<li>北京</li>

<li>上海</li>

<li>廣州</li>

</ul>

li不能單獨存在，必須包裹在ul裡面，ul裡面只有li,ul的作用不是給文字增加小圓點，而是增加無序列表的語義。

li是一個容器級標籤，li裡面什麼都能放。

1.2有序列表

<ol>

酷狗音樂排行榜

<li>1:一百萬個可能</li>

<li>2:卡路里</li>

<li>3:去年夏天</li>

</ol>

也就是說ol和ul就是語義不一樣，怎麼使用都是一樣的，ol裡面只能有li,li必須被ol包裹，li是容器級。

1.3定義列表

定義列表也是一個組標籤，不過比較複雜，出現三個標籤：

dl表示definition list定義列表

dt表示definition title定義標題

dd表示definition description定義描述詞

dt,dd只能在dl裡面，dl裡面只能有dt,dd.

<dl>

<dt>北京</dt>

<dd>國家首都，政治文化</dd>

<dt>上海</dt>

<dd>魔都，外灘</dd>

<dt>廣州</dt>

<dd>中國的南大門</dd>

</dl>

表達的語義是兩層：

1）是一個列表，列出了北京，上海，廣州三個專案

2）每個詞都有自己的描述項

dd是用來描述dt的，並且有就近原則，可以讓一個dt配多個dd,也可以讓每一個dl裡面只有一個dt和一個dd

結構：

<dl>
<dt>購物指南</dt>
<dd>
<a href="#">購物流程 </a>
<a href="#">會員介紹 </a>
<a href="#">常見問題 </a>
</dd>
</dl>
  

dt和dd都是容器級標籤，什麼都可以放。

二、div和span

div和span是非常重要的標籤，div的語義是division“分割”；

span的語義是span“範圍”；

<div>
<h3>中國主要城市</h3>
<ul>
<li>北京</li>
<li>上海</li>
<li>廣州</li>
</ul>
</div>

div在所有瀏覽器中，預設是不會增加任何效果的，但語義變了，div中所有元素是一個小區域，div是一個容器級，裡面什麼都可以放。

span也是表達“小區域”的標籤，但是是一個“文字級“的標籤，span裡面只能放文字，圖片，表單元素。

<p>
 簡介.........
<span>
<a href="#">詳細資訊</a>
<a href="#">購買</a>
</span>
</p>