1. 程式人生 > >HTML中的無序列表講解(菜鳥)

HTML中的無序列表講解(菜鳥)

cnblogs 商品列表 fin 圓點 list 包含 單獨 有序列表 註意

什麽是列表標簽?

1.列表標簽的作用:給一堆數據添加列表語義,也就是告訴搜素引擎告訴瀏覽器這一堆數據是一個整體。

2.HTML中列表標簽的分類

  2.1無序列表(最多人用)(unordered list)

  2.2有序列表(最少人用)(ordered list)

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

3無序列表作用:

給一堆數據添加列表語義,並且這一堆數據所有的數據都沒有先後之分

什麽叫先後之分?

例如:排行榜

什麽叫沒有先後之分?

例如:中國的所有城市

4.無序列表格式:

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

li其實是英文list item的縮寫

list是列表的意思

item是條目的意思

所以結合起來就是列表條目的意思

例子:

<h2>中國的城市:</h2>
<ul>
    <li>北京</li>
    <li>上海</li>
    <li>廣州</li>
    <li>武漢</li>
</ul>

5.註意點

  5.1一定要記住ul標簽是用來給一堆數據添加列表語義的,而不是用來給他們添加小圓點的

  5.2ul標簽和li標簽是一個整體,是一個組合,所有一般情況下ul標簽和li標簽都是一起出現,不會單個出現,也就是說不會單獨使用一個ul標簽或者單獨使用一個li標簽,都是結合在一起使用的

  5.3由於ul標簽和li標簽是一個組合,所有ul標簽中不推薦包含其他標簽,也就是說以後你在ul標簽中只會看到li標簽

無序列表適用場景(舉例):

1.新聞列表

2.商品列表

3.導航條

HTML中的無序列表講解(菜鳥)