技術標籤：HTML5網頁設計html5

2.2.1 列表標籤

■列表是網頁中常見的內容組織和表現效果。使用列表標籤可以製作導航欄、新聞標題列表以及排行榜等。

■HTML5 中常見的列表標籤包括

■無序列表

■有序列表

■自定義列表

■無序列表

■無序列表中的專案符號是幾何圖形，即在每一項之前新增符號，故又稱為符號列表。

<ul type=“專案符號類”>
    <li> 第 1 項 </li>
    <li> 第 2 項 </li>
    ……
</ul>

無序列表的 type 屬性用於設定列表項開始的符號，取值為 disc（預設值，實心圓）、circle（空心圓環）和 square（正方形）。

■有序列表

<ol type=“序列型別” start=“序號起始值”>
    <li> 第一項 </li>
    <li> 第二項 </li>
    ……
</ol>

預設情況下，採用數字序號進行排列。

有序列表的 type 屬性用於設定有序列表的序號型別，取值為：1、a、A、i 和 I，分別表示數字序列、小寫英文字母序列、大寫英文字母序列、小寫羅馬數字學號以及大寫羅馬數字序列。

■自定義列表

<dl>
    <dt> 名詞 1</dt>
    <dd> 解釋 1</dd>
    <dt> 名詞 2</dt>
    <dd> 解釋 2</dd>
    <dt> 名詞 3</dt>
    <dd> 解釋 3</dd>
    ……
</dl>
 

作為解釋的內容在顯示時會自動縮排，有些像字典中的詞語解釋。

2.2.2 div 標籤和 span 標籤

■div標籤

■預設情況下，div標籤將佔滿一行。

<div>
    其他標籤或內容
</div>

一般div標籤使用id屬性來命名，id 是 HTML5 標籤的屬性，頁面中的每個標籤都存在 id，且不能相同。在對頁面佈局時經常會在 div 標籤中新增 id 屬性，用於表明當前 div 標籤對應於頁面中哪個區域或部分。

■span 標籤

■多個 span 標籤可以存在於同一行，將按照從左到右的方式進行排列。

<span> 文字 </span>
 

（覺得這篇筆記對你有點用的話，麻煩你為本筆記點贊，評論，分享或收藏，因為這將是我輸出更多筆記的動力，感謝！）