簡單好用的 HTML 標籤與屬性
[ 資料來源: CNET 編輯部 2001/05/17 ]

Body 標籤與屬性
字形標籤與屬性
圖形標籤與屬性
超鏈結標籤與屬性
表格標籤與屬性
分割視窗標籤與屬性
表單欄位標籤與屬性

Body 標籤與屬性
<BODY>...</BODY>網頁中將會顯示在瀏覽器畫面上的內容都包含在這組標籤裡面
<BODY bgcolor="color">以十六進位碼設定網頁背景色
<BODY background="filename.xxx"> 以圖片作為頁面的背景(也就是桌布)
<BODY text="color"> 以十六進位碼設定頁面文字顏色
<BODY link="color"> 以十六進位碼設定尚未點選過的超鏈結文字顏色
<BODY alink="color"> 以十六進位碼設定作用中(滑鼠左鍵按下)的超鏈結文字顏色
<BODY vlink="color"> 以十六進位碼設定曾經點選過的超鏈結文字顏色

字形標籤與屬性
<FONT>...</FONT> 設定被包含在此標籤內文字的各種屬性
<FONT size="value">...</FONT> 設定文字的尺寸,從 1 到 7,1 代表最小,7 代表最大文字尺寸
<FONT face="name">...</FONT> 設定文字所使用的字型
<FONT color="color">...</FONT> 以十六進位碼設定文字的顏色

圖形標籤與屬性
<IMG> 在標籤所在的位置插入一張圖片
<IMG src="url" alt="text"> 插入一張圖片,並且為圖片加上說明文字
<IMG src="url" alt="text" align="direction"> 將圖片靠左,靠右對齊(文繞圖效果),或者將旁邊的文字對齊圖片的底端,中央或頂端
<IMG src="url" alt="text" border="number"> 設定圖片的邊框尺寸(設定成 0 代表沒有邊框)
<IMG src="url" alt="text" height="pixels"> 設定圖片的高度
<IMG src="url" alt="text" width="pixels"> 設定圖片的寬度
<IMG src="url" alt="text" hspace="pixels"> 設定圖片左右兩邊的留白寬度
<IMG src="url" alt="text" vspace="pixels"> 設定圖片上下兩邊的留白高度
<IMG src="url" alt="text" usemap="map-name"> 將圖片設定成為(瀏覽器端)影像地圖(需要搭配另一組 <MAP>...</MAP> 標籤才可正常作用)

超鏈結標籤與屬性
<A>...</A> 設定超鏈結的來源與連往的目的地
<A HREF="url">...</A> 產生一個超鏈結,指向 url 所代表的頁面
<A HREF="#NAME">...</A> 連向目前同一頁面中的某個特定目標位置
<A HREF="URL#NAME">...</A> 連向其他網站某個頁面中的特定目標位置
<A NAME="NAME">...</A> 在某個頁面中設定目標位置(又稱為錨點 anchor)
<A HREF="mailto:email">...</A> 建立一個電子郵件信箱連結
選用屬性:
<A HREF="?" target="?">...</A> 指定被連結的頁面要顯示在那個視窗
<A HREF="?" rel="?">...</A> 設定目標頁面和目前頁面本身之間的關係
<A HREF="?" rev="?">...</A> 設定目標頁面和目前頁面本身之間的反向關係

表格標籤與屬性
<TABLE>...</TABLE> 產生一個表格
<TABLE border="pixels"> 設定表格格子的框線寬度
<TABLE cellspacing="pixels"> 設定格子與格子之間的間隔距離
<TABLE cellpadding="pixels"> 設定格子的內留白(格子框線與內容之間的空白)寬度
<TABLE height="pixels" or "%"> 設定表格的高度
<TABLE width="pixels" or "%"> 設定表格的寬度
<TD>...</TD> 定義一個格子(用來放置表格資料)
<TD colspan="columns"> 設定一個格子橫跨的欄的數目
<TD rowspan="rows"> 設定一個格子縱跨的列的數目
<TD nowrap> 不讓格子內的文字自動斷行
<TH>...</TH> 定義表格內容標題,裡面的文字會以粗體字,置中呈現
<TR>...</TR> 定義表格中的一個列
<TR align="?"> or <TD align="?"> 設定表格列或某個格子的內容對齊方式(靠左,靠右或者置中對齊)
<TR valign="?"> or <TD valign="?"> 設定表格列或者某個格子內容的垂直對齊方式(靠上,置中或者靠底端對齊)

分割視窗標籤與屬性
<FRAMESET>...</FRAMESET> 在主瀏覽器視窗中定義分割視窗的切割方式
<FRAMESET rows="value,value"> 在一組分割視窗裡面定義出一個列
<FRAMESET cols="value,value"> 在一組分割視窗裡面定義出一個欄
<NOFRAMES>...</NOFRAMES> 針對不支援分割視窗的瀏覽器顯示選用性的內容
<FRAME src="?"> 設定某個分割視窗要顯示的頁面 url
<FRAME name="name"> 為某個分割視窗命名,以便設定超鏈結的目的地
<FRAME marginwidth="#"> 設定某個分割視窗的內容左右兩邊留白寬度
<FRAME marginheight="#"> 設定某個分割視窗的內容上下兩邊留白高度
<FRAME scrolling="value"> 設定某個視窗是否出現捲軸
<FRAME noresize> 不讓使用者改變某個分割視窗的尺寸大小

表單欄位標籤與屬性
<FORM>...</FORM> 產生一個表單,用來放置各種欄位
<FORM action="url"> 指定要用來處理表單內容的程式的位置與檔名
<FORM method="get|post"> 指定瀏覽器傳送資料給後端程式的方式
<FORM accept="media type"> 指定處理表單資料的伺服器所支援的 MIME 類型
<FORM accept-charset="text"> 指定處理表單資料的伺服器所支援的字集
<FORM enctype="media type"> 指定表單資料的格式
<OPTION> 定義下拉選單中的一個選項
<SELECT name="NAME">...</SELECT> 產生一個下拉選單
<INPUT type="checkbox"> 產生一個核取方塊(複選)
<INPUT type="hidden"> 建立一個隱藏欄位(該欄位不會顯示在瀏覽器畫面上)
<INPUT type="image"> 建立一個用來代替提交按鈕的圖片(與提交按鈕一樣按下後會把表單資料傳送給指定的程式)
<INPUT type="password"> 產生一個單行的密碼輸入欄位(輸入的內容會以 * 號顯示在畫面上,避免他人窺見)
<INPUT type="radio"> 產生一個收音機按鈕(單選)
<INPUT type="text"> 產生一個單行的文字輸入欄位
<INPUT type="submit"> 產生一個表單資料提交按鈕,按下後會把表單資料傳送給指定的程式
<INPUT type="reset"> 產生一個用來恢復表單內容的清除按鈕,按下以後表單內容會恢復成原本的預設