回到學院首頁選擇製網課程教學與製網有關的語言選擇輔助課程選擇網頁材料了解 HKIWC
The Best Web Hosting Company
 今昔HTML
 HTML概念
 標記一覽
 文件標記
 排版標記
 字體標記
 清單標記Here
 表格標記
 表單標記
 圖形標記
 連結標記
 框架標記
 影像地圖
 多媒體
 其他標記
 特殊字元
 調色原理
 StyleSheets
 加入實例
 本節實例
 疑難討論
 聯絡學院
 網絡辭典
歡迎到訪 PenPal Garden
ICQ 國際交友會
  ■ 本節主要介紹的標記:
<OL> <LI>
<UL>
<MENU> <DIR>
<DL> <DT> <DD>

欲明白本篇【HTML剖析】之標記分類請看 【標記一覽】。
亦請先明白圍堵標記與空標記的分別請看 【HTML概念】。

<OL> <LI> :
<OL>稱為順序清單標記。<LI>則用以標示清單項目。
所謂順序清單就是在每一項前面加上 1,2,3... 等數目,又稱編號清單。

<OL> 的參數設定(常用):
例如: <ol type="i" start="4"></ol>

  • type="i"
    設定數目款式,其值有五種,請參考 右表,內定為 type="1"。
  • start="4"
    設定開始數目,不論設定了哪一數 目款式,其值只能是 1,2,3.. 等整 數,內定為 start="1"。
TypeNumbering style
1arabic numbers1, 2, 3, ...
alower alphaa, b, c, ...
Aupper alphaA, B, C, ...
ilower romani, ii, iii, ...
Iupper romanI, II, III, ...

<LI> 的參數設定(常用):
例如: <li type="square" value="4">

  • type="square"
    只適用於非順序清單,設定符號款式,其值有三種,如下,內定為 type="disc":
    符號 是當 type="disc" 時的列項符號。
    符號 是當 type="circle" 時的列項符號。
    符號 是當 type="square" 時的列項符號。
  • value="4"
    只適用於順序清單,設定該一項的數目,其後各項將以此作為起始數目而遞增, 但前面各項則不受影響,其值只能是 1,2,3.. 等整數,沒有內定值。

例子:
HTML Source Code (原始碼) 瀏覽器顯示結果
My best friends:
<ol>
<li>Michelle Wei
<li>Michael Wan
<li>Gloria Lam
</ol>
My best friends:
  1. Michelle Wei
  2. Michael Wan
  3. Gloria Lam

<UL> :
<UL>稱為無序清單標記。
所謂無序清單就是在每一項前面加上 等符號,故又稱符號清單。

<UL> 的參數設定(常用):
例如: <UL type="square">

  • type="square"
    設定符號款式,其值有三種,如下,內定為 type="disc":
    符號 是當 type="disc" 時的列項符號。
    符號 是當 type="circle" 時的列項符號。
    符號 是當 type="square" 時的列項符號。

注意:由於 <UL> 及 <LI> 都有 type 這個參數,兩者盡可能選用其一。

例子:
HTML Source Code (原始碼) 瀏覽器顯示結果
My Homepages:
<ul>
<li>Penpals Garden
<li>ICQ Garden
<li>Software City
<li>Creation of Webpage
</ul>
My Homepages:
  • Penpals Garden
  • ICQ Garden
  • Software City
  • Creation of Webpage

<MENU> <DIR> :
這兩個標記都不為 W3C 所贊同,希望用者能以 <ul> 及 <ol> 代之。
<MENU> 及 <DIR>,基本上它和 <ul> 是一樣的,在一些特別的瀏覽器可能表現出 <ol> 的 效果,於舊版的 IE 或 NC 標記 <DIR> 不顯示符號或數目。兩標記的用法與 <ul> 完全一 樣。

例子:
HTML Source Code (原始碼) 瀏覽器顯示結果
My Homepages:
<dir>
<li>Penpals Garden
<li>ICQ Garden
<li>Software City
<li>Creation of Webpage
</dir>
My Homepages:
  • Penpals Garden
  • ICQ Garden
  • Software City
  • Creation of Webpage
  • <DL> <DT> <DD> :
    <DL>稱為定義清單標記。 <DT> 用以標示定義條目,<DD> 則用以標示定義內容。
    所謂定義清單就是一種分二層的項目清單,其不故符號及數目。

    三個標記都沒有常用的參數。而 <DT> <DD> 可以獨立使用,只是一些舊的瀏覽器并不支 援,如 IE 3.0。常用的如 <DD> 標記可用以製造段落第一個字前面的空白。

    例子:
    原始碼 <dl>
    <dt>How to use Definition List
    <dd>First, you should not place paragraph tag right after or before a list structure or between the items of a list. In cerntain contexts, use of extra paragraph tags should always be avoided, when you realize this concept, it is quit easy to write a HTML.
    <dt>Other things to know
    <dd>We usually put only ONE Definition tag following the Definition Term tag, more than one DD tag is not recommanded. Besides, unlike Definition List is a nonempty tag, both Definition Term and Definition Description are empty tags.
    </dl>
    顯示結果
    How to use Definition List
    First, you should not place paragraph tag right after or before a list structure or between the items of a list. In cerntain contexts, use of extra paragraph tags should always be avoided, when you realize this concept, it is quit easy to write a HTML.
    Other things to know
    We usually put only ONE Definition tag following the Definition Term tag, more than one DD tag is not recommanded. Besides, unlike Definition List is a nonempty tag, both Definition Term and Definition Description are empty tags.

    The Best Web Hosting Company
    Download Internet Explorer Download Netscape Netvigator