五,列表標簽

一,無序列表

1,列表標簽定義

給一堆數據添加列表語義,也就是告訴搜索引擎告訴瀏覽器這一堆數據是一個整體的標簽我們稱之為列

表標簽。

2,列表標簽的分類

1)無序列表(最多)(unordered list)

2)有序列表(最少)(ordered list)

3)定義列表(其次)(definition list)

3,無序列表

作用:給一堆數據添加列表語義,并且這一堆數據中所有的數據都沒有先后之分。例如:中國有哪些城市。

格式:

<ul>

? ? <li>需要顯示的條目的內容<li>

<ul>

其中:li是list item(列表條目)的縮寫。

注意:

1)ul標簽是用來給一堆數據添加列表語義的,而不是用來給他們添加條目前的小圓點的;

2)ul標簽和li標簽是一個整體,是一個組合.所以一般情況下ul標簽和li標簽都是一起出現,不會單個出

現.也就是說不會單獨使用一個ul標簽或者單獨使用一個li標簽,都是結合在一起使用;

3)由于ul標簽和li標簽是一個組合,所以ul標簽中不推薦包含其它標簽,也就是說以后你在ul標簽中只

會看到li標簽。

無序列表應用場景:

1)新聞列表;2)商品列表;3)導航條。


有序列表和無序列表使用規則差不多,只不過,有序列表中的條目有先后之分,例如排行榜。

4,定義列表

作用:

1)給一堆數據添加列表語義;

2)先通過dt標簽定義列表中的所有標題,然后再通過dd標簽給每個標題添加描述信息。

格式:

<dl>

? <dt></dt>

? <dd></dd>

? <dt></dt>

? <dd></dd>

</dl>

其中,dt是英文definition title 的縮寫,用來定義列表標題的;dd是英文definition description的縮

寫,是用來定義標題對應的描述的。

應用場景:

1)做網站的尾部信息;2)圖文混排。

注意:

1)dl和dt/dd是一個整體,所以他們一般情況下不會單獨出現,都是一起出現。

2)dl和dt/dd是組合標簽,一般情況下建議dl中只放dt和dd標簽;

3)一個dt可以沒有對應的dd,也可以有多個對應的dd,但是無論有或者沒有dd都不推薦使用.

推薦使用一個dt對應一個dd

4)當需要豐富界面時,在dt和dd標簽中繼續添加其它標簽。


最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容