HTML清單詳解

HTML無序清單

無序清單是一個項目的清單，此列項目使用粗體圓點（典型的小黑圓圈）進行标記。

無序清單使用 < ul > < li >标簽

執行個體

代碼:

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul> 
           

效果

多級無序清單

代碼執行個體

<ul>
	<li>一級1</li>
	<li>一級2</li>
	<li>一級3
	<ul>
		<li>二級1</li>
		<li>二級2</li>
	</ul>
	</li>
	<li>一級4
	<ul>
		<li>二級3</li>
		<li>二級4</li>
		<li>二級5
		<ul>
			<li>三級1</li>
			<li>三級2</li>
		</ul>
		</li>
	</ul>
	</li>
</ul> 
           

修改小圓點

修改無序清單的Type屬性

disc(實心圓) square(實心方塊) circle(空心圓) none(去除)是type四個值

執行個體

代碼

<ul type="circle">
	<li>一級1</li>
	<li>一級2</li>
	<li>一級3
	<ul type="square">
		<li>二級1</li>
		<li>二級2</li>
	</ul>
	</li>
	<li>一級4
	<ul type="disc">
		<li>二級3</li>
		<li>二級4</li>
		<li>二級5
		<ul>
			<li>三級1</li>
			<li>三級2</li>
		</ul>
		</li>
	</ul>
	</li>
</ul> 
           

效果

HTML有序清單

1. 标簽定義了一個有序清單. 清單排序以數字來顯示。

屬性	值	描述
compact	compact	HTML5中不支援，不贊成使用。請使用樣式取代它。 規定清單呈現的效果比正常情況更小巧。
reversed	reversed	指定清單倒序(9,8,7…)
start	number	HTML5不支援，不贊成使用。請使用樣式取代它。 規定清單中的起始點。
type	1 A a I none	i 規定清單的類型。不贊成使用。請使用樣式代替。

執行個體

<ol type="1">
	<li>一級1</li>
	<li>一級2</li>
	<li>一級3
	<ol type="A">
		<li>二級1</li>
		<li>二級2</li>
	</ol>
	</li>
	<li>一級4
	<ol type="Ⅰ" reversed="reversed">
		<li>二級3</li>
		<li>二級4</li>
		<li>二級5
		<ol type="i">
			<li>三級1</li>
			<li>三級2</li>
		</ol>
		</li>
	</ol>
	</li>
</ol> 
           

HTML自定義清單

标簽定義一個描述清單。

标簽與 （定義項目/名字）和

（描述每一個項目/名字）一起使用。 執行個體 代碼:

<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>
           

效果