附錄 A HTML 語法教學

A-1 認識 HTML 語法
HTML 語法是由標籤 (tags) 與屬性 (attributes) 所組成，瀏覽器只要看到 HTML

標籤與屬性，就可以將它解譯成網頁。
 標籤 (tag)：HTML 標籤可以分成兩種，第一種是用來識別網頁上的元件或
描述元件的樣式，例如網頁標題 <TITLE>、網頁主體 <BODY>、標題 1
<H1>、標題 2 <H2>、粗體 <B>、斜體 <I>、段落 <P>、項目符號 <UL>、
編號清單 <OL>…；第二種是用來指向其它資源，例如 <IMG> 可以插入
圖片、<APPLET> 可以插入 Java applets、<A> 可以插入超連結或識別網頁
上的位置…。
HTML 標籤是以 "<"、">" 兩個符號括起來，而且多數標籤會成對出現，舉

例來說，假設要將一串文字設定成斜體 (例如 Happy)，那麼可以輸入文字，
然後分別在文字前後加上 <I> 和 </I> 標籤 (例如 <I>Happy</I>)，其中
<I> 是起始標籤，</I> 是結束標籤。
<I>PHP5&MySQL 程式設計</I>
起始標籤內容結束標籤
當然，還是有些標籤不會成對出現，舉例來說，假設要在一串文字後面加
上中斷字元做強迫換行，那麼可以輸入文字，然後在文字後面加上 <BR>
標籤 (例如 Birthday<BR>)。
 屬性 (attribute)：除了 HTML 標籤本身所能描述的特性之外，大部分標籤還

會搭配屬性，以提供更多資訊。
 HTML 標籤與屬性沒有大小寫之分，但在本附錄中，為了方便閱讀與區分，我
們將全部以大寫表示。
 HTML 標籤後面可以加上數個屬性，但標籤與屬性及屬性與屬性之間必須加上
一個空白字元，附錄 B 有 HTML 標籤與屬性速查供您參考。
A-2
HTML 語法教學 A
舉例來說，假設要將一串文字設定成標題 1，而且文字為紅色、置中對齊，
那麼除了要在文字前後分別加上 <H1> 和 </H1> (標題 1) 標籤之外，還要
加上紅色及置中對齊屬性：
<H1 COLOR="#FF0000" ALIGN="CENTER">快樂頌</H1>
結束標籤
起始標籤
空白字元
屬性
空白字元
屬性
內容
值
 值 (value)：通常屬性會有一個值，而且這個值必須從預先定義好的範圍內
選取，不能自行定義，例如 <HR> (水平線) 標籤的 ALIGN (對齊方式) 屬
性的值只有 LEFT、RIGHT、CENTER 三種，使用者不能自行指定其它值。
請注意，我們通常會在值的前後加上雙引號 (")，但如果值是由英文字母、
阿拉伯數字 (0 ~ 9)、減號 (-) 或小數點 (.) 所組成，那麼雙引號 (") 可以
省略不寫。
 巢狀標籤 (nesting tag)：有時我們可能需要使用一個以上的標籤來表示網頁

的資料，舉例來說，假設要將一串標題 1 文字 (例如 Happy Birthday) 中的
某個字 (例如 Birthday) 加上斜體效果，那麼就要使用 <H1> 和 <I> 兩個
標籤：
<H1>Happy <I>Birthday</I></H1>
順序正確
<H1>Happy <I>Birthday</H1></I>
順序不正確
請注意巢狀標籤之間的順序，原則上，第一個結束標籤必須對應最後一個
起始標籤，第二個結束標籤必須對應倒數第二個標籤，依此類推。
A-3
 空白字元：瀏覽器會忽略 HTML 標籤之間多餘的空白字元或 [Enter]，因
此，我們可以利用這個特點在 HTML 原始檔加上空白字元和 [Enter]，將
HTML 原始檔排列整齊，好方便閱讀。
適度地加上空白字元和 [Enter]，既
不會影響正確性又可以幫助閱讀。
請注意，正由於瀏覽器會忽略 HTML 標籤之間多餘的空白字元或 [Enter]，

因此，您不能使用空白字元或 [Enter] 將網頁內容格式化，舉例來說，如
果您想將網頁的一段文字強迫換行，那麼必須在這段文字前面插入 <BR>
標籤，光在 HTML 原始檔中按 [Enter]，是不能強迫換行的。
 特殊字元：HTML 網頁有一些特殊字元，例如小於 (<)、大於 (>)、雙引號

(")、&、空白字元…，如果要在網頁上顯示這些字元，那麼不能直接使用
鍵盤輸入，而是要分別輸入 <、&gt；、"、&、 …，附錄
C 有完整的 HTML 特殊字元表供您參考。
錯誤寫法瀏覽結果
使用<BR>做強迫中斷
正確寫法瀏覽結果
使用<BR&gt 做強迫中斷
A-4
HTML 語法教學 A
A-2 HTML 網頁的整體架構

HTML 網頁的整體架構分成三個部分－HTML 版本宣告、標題宣告、網頁主體，
下面是一個例子：
\append1\hello.htm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html40/strict.dtd"> HTML 版本宣告
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> 標題宣告
<TITLE>我的第一個網頁</TITLE>
</HEAD>
<BODY> 網頁標題
Hello World! 網頁主體
</BODY>
</HTML>
網頁內容網頁檔名
 <!DOCTYPE> 標籤：這個標籤用來宣告 HTML 網頁的版本訊息。
 <HTML>...</HTML> 標籤：這個標籤用來識別 HTML 網頁，如果 HTML 網

頁已經有 <!DOCTYPE> 標籤，那麼 <HTML> 標籤可以省略不寫，之所以
有這個標籤的存在，主要是考慮到不支援 <!DOCTYPE> 標籤的瀏覽器。
當我們撰寫網頁時，<HTML> 標籤是放在 <!DOCTYPE> 標籤後面，而且
是成對出現，也就是必須加上結束標籤 </HTML>。
A-5
 <HEAD>...</HEAD> 標籤：這個標籤包含網頁的相關資訊，例如網頁標題、
樣式定義、網頁使用的 scrips、對搜尋引擎有幫助的關鍵字…。當我們撰寫
網頁時，<HEAD> 標籤是放在 <HTML> 標籤後面，而且是成對出現，也
就是必須加上結束標籤 </HEAD>。
◆ <META> 標籤：這個標籤用來指定網頁的編碼方式為 UTF-8，如果網頁有

輸出中文到用戶端瀏覽器，就一定要加上這行敘述，否則可以省略不寫。
◆ <TITLE>...</TITLE> 標籤：這個標籤用來設定網頁標題，該標題會顯示在
瀏覽器的標題列。當我們撰寫網頁時，<TITLE> 標籤一定要放在 <HEAD>...
</HEAD> 標籤內，而且是成對出現，也就是必須加上結束標籤 </TITLE>。
 <BODY>...</BODY> 標籤：這個標籤用來設定網頁主體，包括網頁的文字、
圖片、影像、動畫、色彩、音效、超連結…。當我們撰寫網頁時，<BODY>
標籤是放在 <HEAD>...</HEAD> 標籤後面，而且是成對出現，也就是必須
加上結束標籤 </BODY>。
請注意，除了 HTML 標籤本身所能描述的特性之外，大部分標籤還會搭配屬性，

以提供更多資訊，在此，我們僅示範性的列出 <BODY>...</BODY> 標籤的屬性
做說明，其它標籤的屬性請參閱附錄 B。
<BODY> 標籤的屬性說明
ALINK = "#RRGGBB" 或 "..." 設定超連結文字被選取時的色彩。
BACKGROUND = "URL" 設定網頁背景圖片的相對或絕對位置。
BGCOLOR = "#RRGGBB"或 "..." 設定網頁背景色彩。
BGPROPERTIES = "FIXED" 設定網頁背景圖片為浮水印 (僅適用於 IE)。
CLASS = "..." 設定 <BODY> 標籤的樣式類別。
ID = "..." 設定 <BODY> 標籤的 ID 識別字。
LEFTMARGIN = "n" 設定網頁的左邊界大小 (n 為像素點數，僅適用於 IE)。
LINK = "#RRGGBB" 或 "..." 設定尚未瀏覽過之超連結文字的色彩。
SCROLL = "{YES,NO}" 設定是否要顯示網頁的捲軸 (僅適用於 IE 4)。
A-6
HTML 語法教學 A
屬性說明
STYLE = "..." 設定 <BODY> 標籤的樣式表命令。
TEXT = "#RRGGBB"或"..." 設定網頁的文字色彩。
TITLE = "..." 設定 <BODY> 標籤的標題，瀏覽器可能用它做為

提示文字。
TOPMARGIN = "n" 設定網頁的上邊界大小 (n 為像素點數，僅適用於 IE)。
VLINK = "#RRGGBB" 或 "..." 設定已瀏覽過之超連結文字的色彩。
這個標籤亦接受 LANG 、 DIR 、 onLoad 、 onUnLoad 、 onClick 、 onDblClick 、

onMouseDown、onMouseUp、onMouseOver、onMouseMove、onMouseOut、onKeyPress、
onKeyDown、onKeyUp 等屬性，請參閱第 A-3 節的說明。
顏色值顏色值
Black (黑 ) "#000000" Silver (銀) "#C0C0C0"
Gray (灰 ) "#808080" White (白) "#FFFFFF"
Maroon (褐 ) "#800000" Red (紅 ) "#FF0000"
Green (綠) "#008000" Teal (藍綠) "#008080"
Navy (深藍) "#008000" Yellow (黃) "#FFFF00"
Olive (橄欖 ) "#808000" Blue (藍) "#0000FF"
Purple (紫) "#800080" Lime (螢光綠) "#00FF00"
Aqua (水藍) "#00FFFF" DarkBlue (深藍 ) "#00008B"
Darkgreen (深綠) "#006400" Cyan (藍綠 ) "#00FFFF"
Seagreen (海綠) "#2E8B57" Indigo (深紫藍) "#4B0082"
Brown (棕色) "#A52A2A" Pink (粉紅 ) "#FFC0CB"
Orange (橘色) "#FFA500" DarkOrange (深橘色 ) "#FF8C00”
Deeppink (深粉紅) "#FF1493" Lightyellow (淡黃 ) "#FFFFE0"
Snow (雪白) "#FFFAFA" Salmon (褚色) "#FA8072"
Chocolate (巧克力色) "#D2691E" Khaki (卡其色) "#F0E68C"
A-7
A-3 事件處理程式
「事件處理程式」(event handler) 指的是將瀏覽者的動作 (例如按下滑鼠或按鍵)
和 script 程式連結，換句話說，當瀏覽者做下某些動作時，就去執行指定的 script
程式。許多 HTML 標籤均接受如下屬性，以指定事件處理程式，其中 onSubmit
和 onReset 只能用在 <FORM> 標籤，onSelect 只能用在 <INPUT> 和 <TEXTAREA>
標籤，onChange 只能用在 <INPUT>、<SELECT> 和 <TEXTAREA> 標籤。
屬性說明
onLoad = "..." 設定當瀏覽器載入網頁或所有框架後所要執行的 script。
onUnload = "..." 設定當瀏覽器移除視窗或框架內的網頁後所要執行的 script。
onClick = "..." 設定當滑鼠在元件上按一下時所要執行的 script。
onDblClick = "..." 設定當滑鼠在元件上按兩下時所要執行的 script。
onMouseDown = "..." 設定當滑鼠在元件上按下按鍵時所要執行的 script。
onMouseUp = "..." 設定當滑鼠在元件上放開按鍵時所要執行的 script。
onMouseOver = "..." 設定當滑鼠移過元件時所要執行的 script。
onMouseMove = "..." 設定當滑鼠在元件上移動時所要執行的 script。
onMouseOut = "..." 設定當滑鼠自元件上移開後所要執行的 script。
onFocus = "..." 設定當瀏覽者將焦點移到元件上時所要執行的 script。
onBlur = "..." 設定當瀏覽者將焦點自元件上移開後所要執行的 script
onKeyPress = "..." 設定在元件上按下再放開按鍵時所要執行的 script。
onKeyDown = "..." 設定在元件上按下按鍵時所要執行的 script。
onkeyUp = "..." 設定在元件上放開按鍵時所要執行的 script。
onSubmit = "..." 設定當瀏覽者傳送表單後所要執行的 script。
onReset = "..." 設定當瀏覽者清除表單後所要執行的 script。
onSelect = "..." 設定當瀏覽者在文字欄位選取文字後所要執行的 script。
onChange = "..." 設定當瀏覽者修改表單欄位後所要執行的 script。
A-8
HTML 語法教學 A
A-4 資料編輯與格式化
A-4-1 設定標題格式
HTML 提供六種層次的標題格式 <H1>...</H1>、 <H2>...</H2>、 <H3>...</H3>、
<H4>...</H4>、<H5>...</H5>、<H6>...</H6>，其中以 <H1>...</H1> (標題 1) 的字
體最大，<H6>...</H6> (標題 6) 的字體最小。這些標題標籤有個最重要的屬性－
ALIGN = "{LEFT, CENTER, RIGHT}"，用來表示標題文字向左對齊、置中或向右
對齊，下面是一個例子，如果您要查看這些標籤的所有屬性，可以參閱附錄 B。
\append1\heading.htm
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<TITLE>示範標題格式網頁</TITLE>
</HEAD>
<BODY>
<H1 ALIGN="LEFT">這是向左對齊的標題 1</H1>
<H2 ALIGN="CENTER">這是置中的標題 2</H2>
<H3 ALIGN="RIGHT">這是向右對齊的標題 3</H3>
<H4>這是標題 4 (Heading 4)</H4>
</BODY>
</HTML>
雖然有六種標題，但建議您
不要使用三種以上的標題，
免得造成網頁的組織紊亂。
A-9
A-4-2 設定段落格式
網頁內容通常是由數個段落所組成，而輸入段落最簡單的方式就是使用
<P>...</P> 段落標籤。另外， HTML 還提供其它幾種段落格式，例如
<ADDRESS>...</ADDRESS> 位址段落標籤、 <BR> 強迫換行標籤、
<BLOCKQUOTE>...</BLOCKQUOTE> 左右縮排標籤、<PRE>...</PRE> 預先格式
化標籤。
由於瀏覽器會忽略 HTML 標籤之間多餘的空白字元或 [Enter]，因此，即便您在

HTML 原始檔中按 [Enter] 企圖做分段，瀏覽器一樣會忽略 [Enter]，而將文字
全部顯示成相同段落，倘若想如我們所願地將一篇文章顯示成四個段落，那麼
得在每個段落前後分別加上開始標籤 <P> 和結束標籤 </P>，例如：
\append1\p.htm
<HTML>
<HEAD>
<TITLE>使用段落標籤的網頁</TITLE>
</HEAD>
<BODY>
在每行文字前後加
<P>天命之謂性，率性之謂道，修道之謂教。</P> 上 <P> 和 </P>
<P>道也者，不可須臾離也；可離，非道也。</P>
<P>是故，君子戒慎乎其所不賭，恐懼乎其所不聞。</P>
<P>莫見乎隱，莫顯乎微，故君子慎其獨也。</P>
</BODY>
</HTML>
瀏覽結果顯示成四個段落
A-10
HTML 語法教學 A
<P> 標籤的屬性說明
ALIGN = "{LEFT, CENTER, RIGHT}" 段落向左對齊、置中或向右對齊。
WIDTH = "n" 設定段落的寬度 (n 為像素點數，僅適用於 IE)。
這個標籤亦接受 LANG、DIR、CLASS、ID、STYLE、TITLE、onClick、onDblClick、
onKeyDown、onKeyUp 等屬性。
A-4-3 預先格式化段落
由於瀏覽器會自動忽略 HTML 標籤之間多餘的空白字元和 [Enter]，導致在輸入
某些網頁內容時相當不方便，此時，我們可以使用 <PRE>...</PRE> 標籤，預先
將網頁內容格式化。
\append1\pre.htm
<HTML>
<HEAD>
<TITLE>示範預先格式化網頁</TITLE>
</HEAD>
<BODY>
<PRE> 利用 <PRE> 標籤做預先格式化
#include <studio.h>
void main()
{
printf("Hello World!\n")
}
</PRE>
</BODY>
</HTML>
A-11
A-4-4 註解
 標籤可以在網頁上插入註解，而且註解不會顯示在瀏覽器，例如下面的
網頁瀏覽結果將是一片空白：
\append1\comment.htm
<HTML>
<BODY>

</BODY>
</HTML>
A-4-5 常見的文字格式
粗體、斜體、加底線、大字型、上標、下標...，均是相當常見的文字格式，現
在，我們就來看看這些文字格式的 HTML 標籤及瀏覽結果。
範例瀏覽結果說明
預設的格式 Format 預設的格式
<B>粗體 Bold</B> 粗體
<I>斜體 Italic</I> 斜體
<U>加底線 Underlined</U> 加底線
<BIG>BIG</BIG> FONT 大字型
H<SUB>2</SUB>O 下標
X<SUP>3</SUP> 上標
<SMALL>SMALL</SMALL> FONT 小字型
A-12
HTML 語法教學 A
範例瀏覽結果說明
<EM>強調斜體 Emphasized</EM> 強調斜體
<STRONG>強調粗體 Strong</STRONG> 強調粗體
<DFN>定義 Definition</DFN> 定義文字
<CODE>程式碼 Code</CODE> 程式碼文字
<SAMP>範例 SAMPLE</SAMP> 範例文字
<KBD>鍵盤 Keyboard</KBD> 鍵盤文字
<VAR>變數 Variable</VAR> 變數文字
<CITE>引用 Citation</CITE> 引用文字
<ABBR>縮寫，如 HTTP</ABBR> 縮寫文字
<ACRONYM>頭字語 Acronym</ACRONYM> 頭字語
<STRIKE>刪除字 Strike</STRIKE> 刪除字
<S>刪除字 Strike</S> 刪除字
<TT>Monospace Font</TT> 打字機字體
<Q>Gone with the Wind</Q> 引用語
這些標籤均接受 CLASS、ID、STYLE、TITLE、LANG、DIR、onClick、onDblClick、
onKeyDown、onKeyUp 等屬性。
A-4-6 水平線
我們可以使用 <HR> 標籤在網頁上插入水平線，這個標籤的重要屬性有 ALIGN
= "{LEFT, CENTER, RIGHT}" (水平線向左對齊、置中或向右對齊)、COLOR =
"#RRGGBB " 或 "..." (水平線顏色)、WIDTH = " n" (水平線寬度) 、SIZE = " n" (水
平線高度)，例如顏色為 Green、寬度為視窗比例 50%、高度為 5 像素點、靠左
對齊的水平線可以寫成如下：
<HR COLOR="Green" ALIGN="LEFT" WIDTH="50%" SIZE="5">
A-13
A-4-7 文字字型、色彩與大小
網頁上一成不變的字型、色彩與大小已經開始令您厭倦了嗎？如果是的話，那
麼就讓我們使用 <FONT>...</FONT> 標籤的 FACE、COLOR、SIZE 屬性，來改
變文字的字型、色彩與大小吧。
\append1\font.htm
<HTML>
<HEAD>
<TITLE>示範字型、色彩及大小的網頁</TITLE>
</HEAD>
<BODY>
聽風在唱<BR>
<FONT SIZE="1" COLOR="Green" FACE="華康細圓體">聽風在唱</FONT><BR>
<FONT SIZE="2" COLOR="Purple" FACE="華康行書體">聽風在唱</FONT><BR>
<FONT SIZE="3" COLOR="Red" FACE="華康流線體">聽風在唱</FONT><BR>
<FONT SIZE="4" COLOR="Navy" FACE="華康娃娃體">聽風在唱</FONT><BR>
<FONT SIZE="5" COLOR="Teal" FACE="華康彩帶體">聽風在唱</FONT><BR>
<FONT SIZE="6" COLOR="Blue" FACE="華康布丁體">聽風在唱</FONT><BR>
<FONT SIZE="7" COLOR="Olive" FACE="華康古印體">聽風在唱</FONT><BR>
</BODY>
</HTML>
A-14
HTML 語法教學 A
A-4-8 項目符號與編號清單
當您在閱讀書籍或整理資料時，可能會希望將相關的資料條列式地編列出來，
讓資料顯得有條不紊，那麼可以使用 <UL>...</UL> 標籤為資料加上項目符號，
或使用 <OL>...</OL> 標籤為資料加上編號清單。
以下面的程式碼為例，我們除了使用 <UL> 標籤設定項目符號，還使用 <LI>

標籤設定個別的項目資料，同時亦搭配 <FONT> 標籤設定項目資料的色彩、字
型等格式。
\append1\ul.htm
<HTML>
<HEAD>
<TITLE>示範項目符號的網頁</TITLE>
</HEAD>
<BODY>
<UL TYPE="CIRCLE">
<LI><FONT COLOR="#800000" FACE="華康行書體">射雕英雄傳</FONT></LI>
<LI><FONT COLOR="#800000" FACE="華康行書體">神雕俠侶</FONT></LI>
<LI><FONT COLOR="#800000" FACE="華康行書體">倚天屠龍記</FONT></LI>
<LI><FONT COLOR="#800000" FACE="華康行書體">碧血劍</FONT></LI>
</UL>
</BODY>
</HTML>
<UL> 標籤的 TYPE = "{SQUARE,

CIRCLE, DISC}" 屬性可以用來設
定項目符號的類型為、、。如
果要換成圖片項目符號，可以使用
SRC 屬性設定圖片的相對或絕對位
置，這個屬性僅適用於 IE。
A-15
以下面的程式碼為例，我們除了使用 <OL> 標籤設定編號清單，還使用 <LI>
標籤設定個別的編號資料，同時亦搭配 <FONT> 標籤設定編號資料的色彩、字
型等格式。
\append1\ol.htm
<HTML>
<HEAD>
<TITLE>示範編號清單的網頁</TITLE>
</HEAD>
<BODY>
<OL TYPE="A">
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">玩具總動員</FONT></LI>
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">蟲蟲危機</FONT></LI>
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">花木蘭</FONT></LI>
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">泰山</FONT></LI>
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">小美人魚</FONT></LI>
<LI><FONT COLOR="#0066FF" SIZE="5" FACE="華康雅宋體">鐘樓怪人</FONT></LI>
</OL>
</BODY>
</HTML>
<OL> 標籤的 TYPE = "{1, A, a, I, i}"

屬性可以用來設定編號的類型，預設
為阿拉伯數字，編號清單的起始值不
一定從 1、A、a、I、i 開始，您可以
使用 START 屬性設定起始值。
A-16
HTML 語法教學 A
A-5 超連結
A-5-1 建立超連結
我們可以使用 <A>...</A> 標籤在網頁上插入超連結，然後透過其 HREF = " URL"
屬性設定超連結所連結之文件的相對或絕對位置。現在，我們以下圖為例，說
明建立超連結的幾種情況：
My Web
about.htm
Support
staff.htm question.htm
 連結位於相同資料夾的文件：假設要將 staff.htm 內的文字「常見問題集」

設定成連結至 question.htm 的超連結，那麼可以採用文件相對 URL 來設定
超連結的 URL，例如 <A HREF="question.htm">常見問題集</A>。
 連結位於不同資料夾的文件：假設要將 about.htm 內的文字「員工」設定成

連結至 staff.htm 的超連結，那麼可以採用文件相對 URL 來設定超連結的
URL，例如 <A HREF="Support\staff.htm">員工</A>。
 連結 Web 上的文件：假設要將文字「HiNet」設定成連結至 HiNet 的超連結，

那麼必須採用絕對 URL，例如 <A HREF="http://www.hinet.net/">HiNet</A>。
在將文字設定成超連結後，如果以瀏覽器開啟網頁，超連結文字將變成藍色加底
線，而在超連結文字被點取後會變成紫色加底線。倘若要自行設定超連結文字的顏
色，可以使用 <BODY>… </BODY> 標籤的 LINK、 ALINK、VLINK 屬性。
A-17
A-5-2 設定連結至 E-mail 地址的超連結
網頁通常都會提供回信服務，瀏覽者只要點取網頁上的電子郵件地址、信箱之
類的圖示或文字，就可以啟動郵件編輯程式，而且收件人的地址已經自動填上。
1. 點取 E-mail 超連結
2. 自動啟動預設的郵件編
輯程式並填入收件人
當您設定連結至 E-mail 地址的超連結時，除了要使用 <A>…</A> 標籤的 HREF

屬性設定收件人的電子郵件地址之外，還要在電子郵件地址前面加上 mailto: 通
訊協定，例如：
<A HREF="mailto:jeanchen@mail.ht.net.tw">歡迎寫信給我們</A>
如果您希望在瀏覽者將指標移到超連結文字時會出現提示文字，可以在設定超
連結的同時使用 <A>…</A> 標籤的 TITLE = "..." 屬性設定提示文字。
A-18
HTML 語法教學 A
A-6 圖片
A-6-1 插入圖片
我們可以使用 <IMG> 標籤在網頁上插入圖片，其屬性如下：
 ALIGN = "{LEFT, RIGHT, TOP, MIDDLE, BOTTOM}"：設定圖片的對齊方式。
 ALT = "..."：設定圖片的替代顯示文字。
 BORDER = " n"：設定圖片的框線粗細 ( n 為像素點數)。
 CONTROLS：當圖片為影像時，可以設定播放控制項 (僅適用於 IE)。
 DYNSRC = " URL"：設定動態影像的相對或絕對位置 (僅適用於 IE)。
 HEIGHT = " n"：設定圖片的高度 ( n 為像素點數)。
 HSPACE = " n"：設定圖片的水平間距 ( n 為像素點數)。
 ISMAP：設定圖片為伺服器端影像地圖。
 LONGDESC = "..."：設定圖片的說明文字。
 LOWSRC = " URL"：設定低解析度圖片的相對或絕對位置。
 LOOP = "{ n, INFINITE}"：設定視訊檔案的播放次數 (n 為次數，僅適用於 IE)。
 NAME = "..."：設定圖片的名稱，以供 scripts、applets 或書籤使用。
 SRC = " URL"：設定圖片的相對或絕對位置。
 START = "{FILEOPEN, MOUSEOVER}"：設定讓動態影像開始播放的事件

(僅適用於 IE)。
 USEMAP = " URL"：設定影像地圖所在的檔案位置及名稱。
 VRML = "..."：設定 VRML 物件的相對或絕對位置。
 VSPACE = " n"：設定圖片的垂直間距 ( n 為像素點數)。
A-19
 WIDTH = " n"：設定圖片的寬度 ( n 為像素點數)。
 這個標籤亦接受 CLASS 、 ID、 STYLE 、 TITLE 、 LANG 、 DIR 、 onClick 、

onDblClick 、 onMouseDown 、 onMouseUp 、 onMouseOver 、 onMouseMove 、
onMouseOut、onKeyUp、onKeyPress 等屬性。
A-6-2 設定圖片的高度、寬度與框線
當您在網頁上插入圖片時，除了可以使用 <IMG> 標籤的 SRC 屬性設定圖片的
相對位置或絕對位置之外，還可以分別使用 HEIGHT、WIDTH、BORDER 屬性設
定圖片的高度、寬度與框線 (以像素點為單位)。如果您沒有設定圖片的高度、
寬度與框線，那麼瀏覽器會顯示圖片預設的大小，而且不會加上框線 (即
BORDER = "0")。
\append\image1.htm
<HTML>
<HEAD>
<TITLE>設定圖片的高度、寬度與框線</TITLE>
</HEAD>
<BODY>
<IMG SRC="mulan4.gif">
高度為 136 點、
<IMG SRC="mulan4.gif" HEIGHT="136" WIDTH="120"> 寬度為 120 點
<IMG SRC="mulan4.gif" BORDER="3"> 框線為 3 點
</BODY>
</HTML>
A-20
HTML 語法教學 A
A-6-3 設定圖片的對齊方式
<IMG> 標籤的 ALIGN 屬性提供了 LEFT (靠左)、RIGHT (靠右)、TOP (靠上)、
MIDDLE (置中)、BOTTOM (靠下) 等五種對齊方式，在說明其中的差別之前，
我們先來看個例子，這個例子的兩張圖片均採用瀏覽器預設的對齊方式。
<BODY>
<P><IMG SRC="mulan1.jpg"> 沒有指定對齊方式
<FONT COLOR="Maroon" FACE="華康古印體" SIZE="5">迪士尼最新動畫鉅獻
<IMG SRC="mulan2.jpg"></FONT></P>
<P><FONT FACE="華康行書體" SIZE="5" COLOR="Maroon">Mulan－花木蘭</FONT></P>
<P><FONT FACE="華康楷書體 W3">唧唧復唧唧，木蘭當戶織，不聞機杼聲，唯聞女
嘆息。問女何所思？問女何所憶？女亦無所思，女亦無所憶......”這首耳熟能響的木
蘭詩，相信您我都背頌過，而今迪士尼將這個中國民間故事搬上動畫的舞台，就讓
我們一起來回味一下吧！</FONT></P>
</BODY>
採用瀏覽器預設的對齊方式
如果在插入第一張圖片的敘述中加上 ALIGN
= "LEFT" 屬性，令第一張圖片靠左對齊，其
它敘述維持不變，瀏覽結果如右圖所示：
<IMG SRC="mulan1.jpg" ALIGN="LEFT">
A-21
= "RIGHT" 屬性，令第一張圖片靠右對齊，其
它敘述維持不變，瀏覽結果如右圖所示：
<IMG SRC="mulan1.jpg" ALIGN="RIGHT">
= "TOP" 屬性，令第一張圖片靠上對齊，其它
敘述維持不變，瀏覽結果如右圖所示：
<IMG SRC="mulan1.jpg" ALIGN="TOP">
= "MIDDLE" 屬性，令第一張圖片置中對齊，
其它敘述維持不變，瀏覽結果如右圖所示：
<IMG SRC="mulan1.jpg" ALIGN="MIDDLE">
= "BOTTOM" 屬性，令第一張圖片靠下對齊，
其它敘述維持不變，瀏覽結果如右圖所示 (事
實上，瀏覽器預設的對齊方式通常就是
BOTTOM)：
<IMG SRC="mulan1.jpg" ALIGN="BOTTOM">
A-22
HTML 語法教學 A
A-7 表格
A-7-1 插入表格
當我們要在網頁上插入表格時，通常會用到下列四個標籤，其意義如下：
 <TABLE>...</TABLE> 標籤：在網頁上標示一個表格。如果要設定表格的對
齊方式 (靠左、靠右、置中)、寬度、背景圖片、背景色彩、框線大小、框
線色彩，可以分別使用 ALIGN = "{LEFT, RIGHT, CENTER}"、WIDTH = " n"、
BACKGROUND = " URL " 、 BGCOLOR = "#RRGGBB " 、 BORDER = " n" 、
BORDERCOLOR = "# RRGG BB" 等屬性，至於暗邊框色彩、亮邊框色彩、儲
存格間距、儲存格墊充等屬性，可以參閱附錄 B。
 <TR>...</TR> 標籤：在表格中標示一列 (Row)，結束標籤 </TR> 可以省略

不寫。如果要設定某一列儲存格的水平對齊方式 (靠左、靠右、置中、左右
對齊、對齊指定的字元)、垂直對齊方式 (靠上、中央、靠下、基線)、背景
色彩，可以分別使用 ALIGN = "{LEFT, RIGHT, CENTER, JUSTIFY, CHAR}"、
VALIGN = "{TOP, MIDDLE, BOTTOM, BASELINE}"、BGCOLOR = "#RRGGBB"
屬性，至於邊框色彩、暗邊框色彩、亮邊框色彩等屬性，可以參閱附錄 B。
 <TD>...</TD> 標籤：在一列中標示一儲存格，結束標籤 </TD> 可以省略

不寫。如果要設定某個儲存格的寬度、水平對齊方式 (靠左、靠右、置中、
左右對齊、對齊指定的字元)、垂直對齊方式 (靠上、中央、靠下、基線)、
背景圖片、背景色彩，可以分別使用 WIDTH = " n"、ALIGN = "{LEFT, RIGHT,
CENTER, JUSTIFY, CHAR}" 、 VALIGN = "{TOP, MIDDLE, BOTTOM,
BASELINE}"、BACKGROUND = " URL"、BGCOLOR = "# RRGGBB " 屬性，至
於邊框色彩、暗邊框色彩、亮邊框色彩、儲存格合併、儲存格文字換行等
屬性，可以參閱附錄 B。
 <TH>...</TH> 標籤：在一列中標示一標題儲存格，結束標籤 </TH> 可以

省略不寫。 <TH>…</TH> 標籤的屬性和 <TD>…</TD> 標籤相同，但
<TH>…</TH> 標籤內的文字會置中並加上粗體。
A-23
我們來做個練習，假設要在網頁上插入如下的 4 x 3 表格 (4 列 3 欄)：
1. 首先，我們要定義表格及其
列數、欄數，在 <BODY>...
</BODY> 標籤之間加入
<TABLE>...</TABLE> 標
籤，同時設定表格框線為
1 像素點，如果沒有設定
框線大小，表示為透明表
格，由於表格有 4 列，所以
在 <TABLE>...</TABLE>
標籤之間加入 4 對
<TR>...</TR> 標籤。
<HTML>
<HEAD>
<TITLE>製作表格</TITLE>
</HEAD>
<BODY>
<TABLE BORDER="1"> 1. 加入 <TABLE>...</TABLE> 標籤
<TR>
2. 根據列數加入 <TR>...</TR> 標籤
</TR>
<TR>
</TR>
<TR>
</TR>
<TR>
</TR>
</TABLE>
</BODY>
<HTML>
A-24
HTML 語法教學 A
2. 接著，我們要在表格的每一列定義各個儲存格，由於表格的欄數為 3，而
且第一列為標題列，所以我們在第一對 <TR>...</TR> 標籤之間加入 3 對
<TH>...</TH> 標籤，其餘各列則各加入 3 對 <TD>...</TD> 標籤，表示每
一列有 3 欄。
<TABLE>
<TR>
<TH></TH>
<TH></TH>
<TH></TH>
</TR>
<TR>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
3. 最後，在每個 <TH>...</TH> 或 <TD>...</TD> 標籤之間加入各個儲存格的

內容，就大功告成了 (網頁上有三張圖片，檔名分別為 maru1.gif、maru2.gif、
maru3.gif)。
A-25
A-7-2 設定表格的對齊方式
<TABLE> 標籤的 ALIGN 屬性提供了 LEFT (靠左)、CENTER (置中)、RIGHT (靠
右) 三種對齊方式，左上圖為預設的對齊方式 (沒有設定 ALIGN 屬性)，右上圖
為靠左對齊，左下圖為置中對齊，右下圖為靠右對齊。
A-7-3 設定表格的背景色彩與背景圖片
我們可以使用 <TABLE> 標籤的 BGCOLOR、BACKGROUND 屬性設定表格的背
景色彩與背景圖片，例如 <TABLE BORDER="1" BGCOLOR="#FFEED2"> 是將表
格的背景色彩設定為 #FFEED2，<TABLE BORDER="1" BACKGROUND="bg.gif">
是將表格的背景圖片設定為 bg.gif，只要將背景圖片放在和網頁相同的資料夾
內，完整路徑就可以省略不寫。
A-26
HTML 語法教學 A
A-7-4 設定儲存格的對齊方式
儲存格的對齊方式分成水平及垂直兩個方向，如果要設定整列儲存格的水平或
垂直對齊方式，可以分別使用 <TR> 標籤的 ALIGN 和 VALIGN 屬性；如果要設
定單一儲存格的水平或垂直對齊方式，可以分別使用 <TD> 標籤的 ALIGN 和
VALIGN 屬性。
<TABLE BORDER="1" WIDTH="100%">

<TR>
<TD><IMG SRC="03.gif"></TD>
<TD ALIGN="LEFT">向左對齊</TD>
<TD ALIGN="CENTER">水平置中</TD>
<TD ALIGN="RIGHT">向右對齊</TD>
</TR>
<TR>
<TD VALIGN="TOP">靠上對齊</TD>
<TD VALIGN="MIDDLE">垂直置中</TD>
<TD VALIGN="BOTTOM">靠下對齊</TD>
</TR>
<TR>
<TD ALIGN="RIGHT" VALIGN="TOP">靠右上對齊</TD>
<TD ALIGN="CENTER" VALIGN="MIDDLE">水平垂直置中</TD>
<TD ALIGN="RIGHT" VALIGN="BOTTOM">靠右下對齊</TD>
</TR>
</TABLE>
A-27
A-7-5 設定儲存格的背景圖片與背景色彩
如果要設定某一列儲存格、某一個儲存格或標題儲存格的背景圖片與背景色
彩，可以分別使用 <TR>、<TD>、<TH> 標籤的 BACKGROUND 和 BGCOLOR 屬
性，下圖是將每一列儲存格設定不同背景色彩的結果：
每一列儲存格設定不同背
景色彩
而下圖是將每一列儲存格設定不同背景色彩並取消表格框線的結果：
每一列儲存格設定不同背
景色彩並取消表格框線
A-28
HTML 語法教學 A
A-8 框架網頁
A-8-1 建立框架網頁
「框架網頁」(frames) 通常會將瀏覽器視窗分割為兩個或兩個以上的部分，每
個部分會連結至不同的網頁。建立框架網頁的步驟可以簡單歸納如下：
1. 決定網頁的框架數目、大小與位置。
2. 製作框架的內容。
3. 設定框架的格式，例如設定框架的上下邊界大小、框線大小、框線色彩、
是否顯示捲軸…。
4. 針對不支援框架的瀏覽器設計網頁內容。
在此，我們會使用下列幾個標籤：
 <FRAMESET>...</FRAMESET> 標籤：這個標籤包含框架網頁的定義及各個
框架的間距、維數、屬性…。如果要設定框架網頁內的垂直框架、水平框
架、每個框架的框線大小、框線色彩，可以使用 COLS = "..."、ROWS = "..."、
BORDER = " n"、BORDERCOLOR = "..." 等屬性，至於其它屬性，可以參閱
附錄 B。
 <FRAME> 標籤：這個標籤用來定義框架網頁內某個框架的來源網頁和屬
性，它必須放在 <FRAMESET>...</FRAMESET> 標籤之間。如果要設定框
架的名稱、來源網頁、框線大小、框線色彩，可以使用 NAME、SRC = " URL"、
BORDER = " n"、BORDERCOLOR = "..." 等屬性，至於框架的上下邊界大小、
左右邊界大小、不允許瀏覽者以滑鼠拖曳邊框的方式改變框架的大小、框
架的捲軸顯示與否等屬性，可以參閱附錄 B。
 <NOFRAMES>...</NOFRAMES> 標籤：如果瀏覽器不支援框架，則顯示這個
標籤之間的網頁內容。
A-29
A-8-2 決定網頁的框架數目、大小與位置
網頁的框架數目、大小與位置須使用 <FRAMESET>...</FRAMESET> 標籤的
COLS 或 ROWS 屬性來定義。一般來說，框架數目通常是以 2 為主，做水平分
割或垂直分割，但實際數目還是取決於您的設計。至於框架的大小可以採用下
列三種表示方式：
一、以像素點數為單位：直接以像素點數表示框架的高度或寬度，例如：
\append\水平框架 1.htm
<HTML>
<HEAD>
<TITLE>以像素點為單位指定水平框架</TITLE>
</HEAD>
<FRAMESET ROWS="100,200"> 上下框架高度各為 100、200 像素點
<FRAME NAME="Top" SRC="1-1.htm"> 上方框架的名稱及來源網頁

<FRAME NAME="Bottom" SRC="1-2.htm"> 下方框架的名稱及來源網頁
</FRAMESET>
</HTML>
上方框架網頁為 <1-1.htm>
上方框架網頁為 <1-2.htm>
A-30
HTML 語法教學 A
\append\1-1.htm
<HTML>
<HEAD>
<TITLE>上方框架</TITLE>
</HEAD>
上方框架的高度為 100 像素點上方框架 <1-1.htm> 的內容
</HTML>
\append\1-2.htm
<HTML>
<HEAD>
<TITLE>下方框架</TITLE>
</HEAD>
下方框架的高度為 200 像素點下方框架 <1-2.htm> 的內容
</HTML>
二、瀏覽器視窗縮放比例：根據瀏覽器視窗縮放比例指定框架的高度或寬度，
例如：
左中右框架網頁各為 <2-1.htm>、
<2-2.htm>、<2-3.htm>
A-31
\append1\垂直框架 1.htm
<HTML>
<HEAD>
<TITLE>以視窗縮放比例指定垂直框架</TITLE>
</HEAD> 左中右框架寬度各為視窗寬
度的 60%、20%、20%
<FRAMESET COLS="60%,20%,20%">
<FRAME NAME="Left" SRC="2-1.htm"> 左方框架的名稱及來源網頁
<FRAME NAME="Middle" SRC="2-2.htm"> 中間框架的名稱及來源網頁
<FRAME NAME="Right" SRC="2-3.htm"> 右方框架的名稱及來源網頁
</FRAMESET>
</HTML>
\append1\2-1.htm
<HTML>
<HEAD>
<TITLE>左方框架</TITLE>
</HEAD>
左方框架的寬度為視窗縮放比例的 60%
</HTML>
\append1\2-2.htm
<HTML>
<HEAD>
<TITLE>中間框架</TITLE>
</HEAD>
中間框架的寬度為視窗縮放比例的 20%
</HTML>
\append1\2-3.htm
<HTML>
<HEAD>
<TITLE>右方框架</TITLE>
</HEAD>
右方框架的寬度為視窗縮放比例的 20%
</HTML>
A-32
HTML 語法教學 A
三、使用星號 (*) 表示成比例的框架或剩餘的空間：您可以使用星號 (*) 表示

高度成比例的水平框架或寬度成比例的垂直框架；另外，您也可以結合前
述的兩種表示方式和星號，此時的星號代表的是瀏覽器視窗剩餘的空間。
下面是一個例子，我們使用 <FRAMESET> 標籤的 ROWS 屬性設定三個水
平框架，第二、三個框架的高度分別為第一個框架的 2、3 倍，換句話說，
這三個水平框架的高度分別為視窗高度的 1/6、2/6、3/6。
\append1\水平框架 2.htm
<HTML>
<HEAD>
<TITLE>以星號(*)指定水平框架</TITLE>
</HEAD>
上中下框架高度各為視
<FRAMESET ROWS="*,2*,3*"> 窗高度的 1/6、2/6、3/6
<FRAME NAME="Top" SRC="3-1.htm">
上中下框架網頁各為
<FRAME NAME="Middle" SRC="3-2.htm"> <3-1.htm>、<3-2.htm>、
<FRAME NAME="Bottom" SRC="3-3.htm"> <3-3.htm>
</FRAMESET>
</HTML>
\append1\3-1.htm
<HTML>
<HEAD>
<TITLE>上方框架</TITLE>
</HEAD>
上方框架的高度為視窗高度的 1/6
</HTML>
A-33
\append1\3-2.htm
<HTML>
<HEAD>
<TITLE>中間框架</TITLE>
</HEAD>
中間框架的高度為視窗高度的 2/6
</HTML>
\append1\3-3.htm
<HTML>
<HEAD>
<TITLE>下方框架</TITLE>
</HEAD>
下方框架的高度為視窗高度的 3/6
</HTML>
A-8-3 製作框架的內容
在使用 <FRAMESET> 標籤的 COLS、ROWS 屬性設定垂直框架或水平框架的數
目、大小與位置後，我們可以使用 <FRAME> 標籤的 NAME 屬性設定個別框架
的名稱，然後使用 <FRAME> 標籤的 SRC 屬性設定個別框架的來源網頁，例如
<FRAME NAME="Left" SRC="3-4.htm"> 表示名稱為 Left 之框架的來源網頁為
3-4.htm。
有關來源網頁的路徑，您可以採用相對或絕對位置，如果來源網頁和框架網頁
位於相同資料夾，那麼可以只寫來源網頁的檔案名稱，至於來源網頁的製作方
式則和一般網頁的製作方式一樣。
請注意，由於 <FRAMESET>...</FRAMESET> 標籤和 <BODY>...</BODY> 標籤

的地位相等，不能同時並存於 HTML 網頁，唯一的例外是 <BODY>...</BODY> 標
籤可以放在 <NOFRAMES>...</NOFRAMES> 標籤之間，將網頁內容格式化。
A-34

附錄 A HTML 語法教學

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

附錄 A HTML 語法教學

Uploaded by

Copyright:

Available Formats

A-1 認識 HTML 語法

HTML 語法是由標籤 (tags) 與屬性 (attributes) 所組成，瀏覽器只要看到 HTML

HTML 標籤是以 "<"、">" 兩個符號括起來，而且多數標籤會成對出現，舉

 屬性 (attribute)：除了 HTML 標籤本身所能描述的特性之外，大部分標籤還

<H1 COLOR="#FF0000" ALIGN="CENTER">快樂頌</H1>

 巢狀標籤 (nesting tag)：有時我們可能需要使用一個以上的標籤來表示網頁

請注意，正由於瀏覽器會忽略 HTML 標籤之間多餘的空白字元或 [Enter]，

 特殊字元：HTML 網頁有一些特殊字元，例如小於 (<)、大於 (>)、雙引號

A-2 HTML 網頁的整體架構

 <!DOCTYPE> 標籤：這個標籤用來宣告 HTML 網頁的版本訊息。

 <HTML>...</HTML> 標籤：這個標籤用來識別 HTML 網頁，如果 HTML 網

◆ <META> 標籤：這個標籤用來指定網頁的編碼方式為 UTF-8，如果網頁有

請注意，除了 HTML 標籤本身所能描述的特性之外，大部分標籤還會搭配屬性，

ALINK = "#RRGGBB" 或 "..." 設定超連結文字被選取時的色彩。

BACKGROUND = "URL" 設定網頁背景圖片的相對或絕對位置。

BGCOLOR = "#RRGGBB"或 "..." 設定網頁背景色彩。

BGPROPERTIES = "FIXED" 設定網頁背景圖片為浮水印 (僅適用於 IE)。

CLASS = "..." 設定 <BODY> 標籤的樣式類別。

ID = "..." 設定 <BODY> 標籤的 ID 識別字。

LEFTMARGIN = "n" 設定網頁的左邊界大小 (n 為像素點數，僅適用於 IE)。

LINK = "#RRGGBB" 或 "..." 設定尚未瀏覽過之超連結文字的色彩。

SCROLL = "{YES,NO}" 設定是否要顯示網頁的捲軸 (僅適用於 IE 4)。

STYLE = "..." 設定 <BODY> 標籤的樣式表命令。

TEXT = "#RRGGBB"或"..." 設定網頁的文字色彩。

TITLE = "..." 設 定 <BODY> 標 籤 的 標 題 ， 瀏 覽 器 可 能 用 它 做 為

TOPMARGIN = "n" 設定網頁的上邊界大小 (n 為像素點數，僅適用於 IE)。

VLINK = "#RRGGBB" 或 "..." 設定已瀏覽過之超連結文字的色彩。

這 個 標 籤 亦 接 受 LANG 、 DIR 、 onLoad 、 onUnLoad 、 onClick 、 onDblClick 、

Black (黑 ) "#000000" Silver (銀) "#C0C0C0"

Gray (灰 ) "#808080" White (白) "#FFFFFF"

Maroon (褐 ) "#800000" Red (紅 ) "#FF0000"

Green (綠) "#008000" Teal (藍綠) "#008080"

Navy (深藍) "#008000" Yellow (黃) "#FFFF00"

Olive (橄欖 ) "#808000" Blue (藍) "#0000FF"

Purple (紫) "#800080" Lime (螢光綠) "#00FF00"

Aqua (水藍) "#00FFFF" DarkBlue (深藍 ) "#00008B"

Darkgreen (深綠) "#006400" Cyan (藍綠 ) "#00FFFF"

Seagreen (海綠) "#2E8B57" Indigo (深紫藍) "#4B0082"

Brown (棕色) "#A52A2A" Pink (粉紅 ) "#FFC0CB"

Orange (橘色) "#FFA500" DarkOrange (深橘色 ) "#FF8C00”

Deeppink (深粉紅) "#FF1493" Lightyellow (淡黃 ) "#FFFFE0"

Snow (雪白) "#FFFAFA" Salmon (褚色) "#FA8072"

Chocolate (巧克力色) "#D2691E" Khaki (卡其色) "#F0E68C"

onLoad = "..." 設定當瀏覽器載入網頁或所有框架後所要執行的 script。

onUnload = "..." 設定當瀏覽器移除視窗或框架內的網頁後所要執行的 script。

onClick = "..." 設定當滑鼠在元件上按一下時所要執行的 script。

onDblClick = "..." 設定當滑鼠在元件上按兩下時所要執行的 script。

onMouseDown = "..." 設定當滑鼠在元件上按下按鍵時所要執行的 script。

onMouseUp = "..." 設定當滑鼠在元件上放開按鍵時所要執行的 script。

onMouseOver = "..." 設定當滑鼠移過元件時所要執行的 script。

onMouseMove = "..." 設定當滑鼠在元件上移動時所要執行的 script。

onMouseOut = "..." 設定當滑鼠自元件上移開後所要執行的 script。

onFocus = "..." 設定當瀏覽者將焦點移到元件上時所要執行的 script。

onBlur = "..." 設定當瀏覽者將焦點自元件上移開後所要執行的 script

onKeyPress = "..." 設定在元件上按下再放開按鍵時所要執行的 script。

onKeyDown = "..." 設定在元件上按下按鍵時所要執行的 script。

onkeyUp = "..." 設定在元件上放開按鍵時所要執行的 script。

onSubmit = "..." 設定當瀏覽者傳送表單後所要執行的 script。

onReset = "..." 設定當瀏覽者清除表單後所要執行的 script。

onSelect = "..." 設定當瀏覽者在文字欄位選取文字後所要執行的 script。

onChange = "..." 設定當瀏覽者修改表單欄位後所要執行的 script。

由於瀏覽器會忽略 HTML 標籤之間多餘的空白字元或 [Enter]，因此，即便您在

ALIGN = "{LEFT, CENTER, RIGHT}" 段落向左對齊、置中或向右對齊。

WIDTH = "n" 設定段落的寬度 (n 為像素點數，僅適用於 IE)。

TITLE = "..." 設定 <BODY> 標籤的標題，瀏覽器可能用它做為

這個標籤亦接受 LANG 、 DIR 、 onLoad 、 onUnLoad 、 onClick 、 onDblClick 、

 START = "{FILEOPEN, MOUSEOVER}"：設定讓動態影像開始播放的事件

 這個標籤亦接受 CLASS 、 ID、 STYLE 、 TITLE 、 LANG 、 DIR 、 onClick 、

 <TD>...</TD> 標籤：在一列中標示一儲存格，結束標籤 </TD> 可以省略

 <TH>...</TH> 標籤：在一列中標示一標題儲存格，結束標籤 </TH> 可以

三、使用星號 () 表示成比例的框架或剩餘的空間：您可以使用星號 () 表示

請注意，由於 <FRAMESET>...</FRAMESET> 標籤和 <BODY>...</BODY> 標籤