實(shí)例

文本域 (Text field)

本例演示如何在 HTML 頁面創(chuàng)建文本域。用戶可以在文本域中寫入文本。

密碼域

本例演示如何創(chuàng)建 HTML 的密碼域。

（可以在本頁底端找到更多實(shí)例。）

表單

表單是一個(gè)包含表單元素的區(qū)域。

表單元素是允許用戶在表單中（比如：文本域、下拉列表、單選框、復(fù)選框等等）輸入信息的元素。

表單使用表單標(biāo)簽（<form>）定義。

<form> ... input 元素 ... </form>

輸入

多數(shù)情況下被用到的表單標(biāo)簽是輸入標(biāo)簽（<input>）。輸入類型是由類型屬性（type）定義的。大多數(shù)經(jīng)常被用到的輸入類型如下：

文本域（Text Fields）

當(dāng)用戶要在表單中鍵入字母、數(shù)字等內(nèi)容時(shí)，就會(huì)用到文本域。

<form> First name: <input type="text" name="firstname" /><br /> Last name: <input type="text" name="lastname" /></form>

瀏覽器顯示如下：

注意，表單本身并不可見。同時(shí)，在大多數(shù)瀏覽器中，文本域的缺省寬度是20個(gè)字符。

單選按鈕（Radio Buttons）

當(dāng)用戶從若干給定的的選擇中選取其一時(shí)，就會(huì)用到單選框。

<form> <input type="radio" name="sex" value="male" />Male <br /> <input type="radio" name="sex" value="female" />Female </form>

瀏覽器顯示如下：

注意，只能從中選取其一。

復(fù)選框（Checkboxes）

當(dāng)用戶需要從若干給定的選擇中選取一個(gè)或若干選項(xiàng)時(shí)，就會(huì)用到復(fù)選框。

<form> <input type="checkbox" name="bike" />I have a bike <br /> <input type="checkbox" name="car" />I have a car </form>

瀏覽器顯示如下：

表單的動(dòng)作屬性（Action）和確認(rèn)按鈕

當(dāng)用戶單擊確認(rèn)按鈕時(shí)，表單的內(nèi)容會(huì)被傳送到另一個(gè)文件。表單的動(dòng)作屬性定義了目的文件的文件名。由動(dòng)作屬性定義的這個(gè)文件通常會(huì)對(duì)接收到的輸入數(shù)據(jù)進(jìn)行相關(guān)的處理。

<form name="input" action="html_form_action.asp" method="get">Username: <input type="text" name="user" /> <input type="submit" value="Submit" /></form>

瀏覽器顯示如下：

假如您在上面的文本框內(nèi)鍵入幾個(gè)字母，然后點(diǎn)擊確認(rèn)按鈕，那么輸入數(shù)據(jù)會(huì)傳送到 "html_form_action.asp" 的頁面。該頁面將顯示出輸入的結(jié)果。

更多實(shí)例

復(fù)選框

本例演示如何在 HTML 頁中創(chuàng)建復(fù)選框。用戶可以選中或取消選取復(fù)選框。

單選按鈕

本例演示如何在 HTML 中創(chuàng)建單選按鈕。

簡單的下拉列表

本例演示如何在 HTML 頁面中創(chuàng)建簡單的下拉列表框。下拉列表框是一個(gè)可選列表。

另一個(gè)下拉列表

本例演示如何創(chuàng)建一個(gè)簡單的帶有預(yù)選值的下拉列表。（編者注：預(yù)選值指預(yù)先指定的首選項(xiàng)。）

文本域(Textarea)

本例演示如何創(chuàng)建文本域（多行文本輸入控件）。用戶可在文本域中寫入文本。可寫入字符的字?jǐn)?shù)不受限制。

創(chuàng)建按鈕

本例演示如何創(chuàng)建按鈕。你可以對(duì)按鈕上的文字進(jìn)行自定義。

Fieldset around data

本例演示如何在數(shù)據(jù)周圍繪制一個(gè)帶標(biāo)題的框。

表單實(shí)例

帶有輸入框和確認(rèn)按鈕的表單

本例演示如何向頁面添加表單。此表單包含兩個(gè)輸入框和一個(gè)確認(rèn)按鈕。

帶有復(fù)選框的表單

此表單包含兩個(gè)復(fù)選框和一個(gè)確認(rèn)按鈕。

帶有單選按鈕的表單

此表單包含兩個(gè)單選框和一個(gè)確認(rèn)按鈕。

從表單發(fā)送電子郵件

此例演示如何從表單發(fā)送電子郵件。

表單標(biāo)簽