XHTML1.0 表單類標籤

<form>

<form> STF 區塊型元素
屬　　性 DTD 說　　明 屬 性 值
action (必要) STF 指定程式的路徑檔名 URL
accept STF 設定資料所接受的 MIME TYPE 類型 list of contenttypes
accept-charset STF 設定資料所接受的字元集 charset_list
enctype STF 送出的文件格式 MIME_TYPE
method STF 傳送資料的方式 get、post
name TF 表單的名稱 form_name
target TF 開啟目標的方式 _blank、_parent、_self、_top、框架的名稱
DTD：S=Strict，T=Transitional，F=Frameset。

網頁中的表單標籤主要是設計為「資料輸入」的一個區域，它可以讓瀏覽者輸入、勾選或選取表單中的資料，然後再做其相對應的處理。

對於瀏覽者而言，這個「資料輸入」的動作並不是表單標籤唯一的目的，其最終的目的是讓瀏覽者做一些資料輸入的行為，然後再配合一些標籤應有的動作之後，再將其資料傳回伺服器的 CGI、 ASP 或 PHP 之類的程式來處理，以達到網頁與瀏覽者之間的一種互動行為。

action 屬性

指定表單標籤的動作，也就是說我們用來處理資料所指定程式的路徑檔名。例如：

<form action="http://123.123.45.6/cgi_bin/DoIt.exe"> … </form>

method 屬性

這是用來設定傳送資料的方式。

  • get ：其傳送的資料會以 HTTP 的方式傳送，且資料不可以大於 512 Bytes。
  • post：其傳送的資料會以 Package 的方式傳送，其資料可以大於 512 Bytes。

<input>

這個標籤並無結束標籤，所以其內容之後請加一個空格與 / 。 <input> 標籤的作用是用來宣告一個可接受輸入的元件(如文字欄位、按鈕、密碼欄位或勾選欄位等等)，這樣的話瀏覽器才能接收瀏覽者想傳送的資料，然後再依照 <form> 標籤中 method 傳送資料方式的設定，將資料傳送給伺服器的程式來做下一步的處理。

<input> STF 置換型元素
屬　　性 DTD 說　　明 屬 性 值
accept STF 文件格式 list_of_mime_types
align TF 排列位置 absmiddle, absbottom, baseline, bottom, right, left, top, middle, texttop
alt STF 描述的文字 text
checked STF 預設已核取 checked
disabled STF 不可選取 disabled
maxlength STF 限定長度 number
name STF 設定其名稱 field_name
readonly STF 只能讀取 readonly
size STF 欄位的寬度 number_of_char
src STF 圖片的路徑 URL
type(必要) STF 元件格式 button, checkbox, file, hidden, image, password, radio, reset, submit, text
value STF 預設的初值 text
DTD：S=Strict，T=Transitional，F=Frameset。
  • align – 當 type="image" 才可用。
  • alt – 當 type="image" 才可用。
  • checked – 當 type="checkbox" 或者 type="radio" 才可用。
  • disabled – 當 type="hidden" 不能用。
  • maxlength – 當 type="text" 或者 type="password" 才可用。
  • name – 除了 type 是 reset 與 submit 外，只要符合 type 其中一個類型就可使用。
  • readonly – 當 type="text" 才可用。
  • size – 當 type="hidden" 不能用。
  • src – 當type="image"才可用。
  • value – 當type="file"不能用、當 type="checkbox" 或 type="radio" 才可用。
範　　例

<form action="" method="get">
ID:
　<input type="text" name="user" value="Your ID" />
　<input type="submit" value="Submit" />
</form>
範例結果

ID:

<option> 與 <optgroup>

<option> STF N/A
屬　　性 DTD 說　　明 屬 性 值
disabled STF 設定為不可選取 disabled
label STF 設定項目的標記 text ※有使用 <optgroup> 才可用
selected STF 設定預設已選擇 selected
value STF 設定預設的初值 text
<optgroup> STF N/A
屬　　性 DTD 說　　明 屬 性 值
label (必要) STF 設定項目的標記 text_label
disabled STF 設定為不可選取 disabled
DTD：S=Strict，T=Transitional，F=Frameset。

　　 <option> 必須與 <select> 一起使用。

範　　例

<select>
　<option>1</option>
　<option>2</option>
　<option selected="selected">3</option>
　<option>4</option>
</select>
範例結果

<select>

<select> STF 置換型元素
屬　　性 DTD 說　　明 屬 性 值
disabled STF 設定為不可選取 disabled
multiple STF 設定為可多重選擇 multiple
name STF 設定其名稱 unique_name
size STF 設定顯示的選項數 number
DTD：S=Strict，T=Transitional，F=Frameset。

這個標籤可以提供給您一個有選項(選單)的欄位。

範　　例

<select>
　<option>1</option>
　<option>2</option>
</select>
範例結果

<textarea>

<textarea> STF 置換型元素
屬　　性 DTD 說　　明 屬 性 值
cols (必要) STF 設定行數(垂直為行) number
rows (必要) STF 設定列數(水平為列) number
disabled STF 設定為不可選取 disabled
name STF 設定其名稱 name_of_textarea
readonly STF 設定只能讀取 readonly
DTD：S=Strict，T=Transitional，F=Frameset。

這個標籤可以提供給您一個多列多行的文字輸入區域。

範　　例

<textarea cols="20" rows="2" name="test" readonly="readonly">
textarea 標籤
</textarea>
範例結果

<button>

<button> STF 單列型元素
屬　　性 DTD 說　　明 屬 性 值
name STF 按鈕名稱 button_name
type STF 按鈕種類 button、reset、submit
value STF 起始值 some_value 值可以被 script 改變
event STF 事件 name_of_textarea
accesskey STF 鍵盤快速鍵 與 script 產生關連
disabled STF 按鈕選按無效 disabled
DTD：S=Strict，T=Transitional，F=Frameset。

此標籤可以用來設置「圖片按鈕」。

範　　例

<button type="button">
<img src="/img/working.png" alt="" />
</button>

<fieldset> 與 <legend>

<fieldset> STF 區塊型元素
<legend> STF 單列型元素
DTD：S=Strict，T=Transitional，F=Frameset。

此標籤用來提供表單的標題與外框，目的是增加表單的美觀。

範　　例

<fieldset><legend>身高體重</legend>
　Height<input type="text" size="5" />
　Weight<input type="text" size="5" />
</fieldset>
範例結果
身高體重

Height
Weight

文章分類

文章標籤