国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

characters

HTML 表單和輸入

HTML 表單用于搜集不同類(lèi)型的用戶(hù)輸入。

實(shí)例

文本域 (Text field)

<html>
<body>

<form>
名：
<input type="text" name="firstname">
<br />
姓：
<input type="text" name="lastname"
</form>

</body>
</html>

密碼域

<html>

<body>

<form>
用戶(hù)：
<input type="text" name="user">
<br />
密碼：
<input type="password" name="password">
</form>
<p>
請(qǐng)注意，當(dāng)您在密碼域中鍵入字符時(shí)，瀏覽器將使用項(xiàng)目符號(hào)來(lái)代替這些字符。
</p>
</body>
</html>

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

表單

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

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

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

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

輸入

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

文本域（Text Fields）

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

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

瀏覽器顯示如下：

First name:   Last name:

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

單選按鈕（Radio Buttons）

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

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

瀏覽器顯示如下：

Male   Female

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

復(fù)選框（Checkboxes）

當(dāng)用戶(hù)需要從若干給定的選擇中選取一個(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>

瀏覽器顯示如下：

I have a bike   I have a car

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

當(dāng)用戶(hù)單擊確認(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>

瀏覽器顯示如下：

Username:

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

更多實(shí)例

復(fù)選框

<html>

<body>

<form>
我喜歡自行車(chē)：
<input type="checkbox" name="Bike">
<br />
我喜歡汽車(chē)：
<input type="checkbox" name="Car">
</form>

</body>
</html>

單選按鈕

<html>

<body>

<form>
男性：
<input type="radio" checked="checked" name="Sex" value="male" />
<br />
女性：
<input type="radio" name="Sex" value="female" />
</form>

<p>;當(dāng)用戶(hù)點(diǎn)擊一個(gè)單選按鈕時(shí)，該按鈕會(huì)變?yōu)檫x中狀態(tài)，其他所有按鈕會(huì)變?yōu)榉沁x中狀態(tài)。</p>

</body>
</html>

簡(jiǎn)單的下拉列表

<html>

<body>

<form>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>

</body>

另一個(gè)下拉列表

<html>

<body>

<form>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected="selected">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>

</body>
</html>

文本域(Textarea)

<html>
<body>

<p>
This example cannot be edited
because our editor uses a textarea
for input,
and your browser does not allow
a textarea inside a textarea.
</p>

<textarea rows="10" cols="30">
The cat was playing in the garden.

創(chuàng)建按鈕

<html>

<body>

<form>
<input type="button" value="Hello world!">
</form>

</body>
</html>

Fieldset around data

<!DOCTYPE HTML>
<html>

<body>

<form>
  <fieldset>
    <legend>健康信息</legend>
    身高：<input type="text" />
    體重：<input type="text" />
  </fieldset>
</form>

<p>如果表單周?chē)鷽](méi)有邊框，說(shuō)明您的瀏覽器太老了。</p>

</body>
</html>

表單實(shí)例

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

<html>
<body>

<form action="/example/html/form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>

<p>請(qǐng)單擊確認(rèn)按鈕，輸入會(huì)發(fā)送到服務(wù)器上名為 "form_action.asp" 的頁(yè)面。</p>

</body>
</html>

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

<html>

<body>

<form name="input" action="/html/html_form_action.asp" method="get">
I have a bike:
<input type="checkbox" name="vehicle" value="Bike" checked="checked" />
<br />
I have a car:
<input type="checkbox" name="vehicle" value="Car" />
<br />
I have an airplane:
<input type="checkbox" name="vehicle" value="Airplane" />
<br /><br />
<input type="submit" value="Submit" />
</form>

<p>如果您點(diǎn)擊 "Submit" 按鈕，您將把輸入傳送到名為 html_form_action.asp 的新頁(yè)面。</p>

</body>
</html>

帶有單選按鈕的表單

<html>

<body>

<form name="input" action="/html/html_form_action.asp" method="get">
Male:
<input type="radio" name="Sex" value="Male" checked="checked">
<br />
Female:
<input type="radio" name="Sex" value="Female">
<br />
<input type ="submit" value ="Submit">
</form>

<p>如果您點(diǎn)擊 "Submit" 按鈕，您將把輸入傳送到名為 html_form_action.asp 的新頁(yè)面。</p>

</body>
</html>

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

<html>

<body>
<form action="MAILTO:php@php.cn" method="post" enctype="text/plain">

<h3>這個(gè)表單會(huì)把電子郵件發(fā)送到 PHP.cn</h3>
姓名：<br />
<input type="text" name="name" value="yourname" size="20">
<br />
電郵：<br />
<input type="text" name="mail" value="yourmail" size="20">
<br />
內(nèi)容：<br />
<input type="text" name="comment" value="yourcomment" size="40">
<br /><br />
<input type="submit" value="發(fā)送">
<input type="reset" value="重置">

</form>
</body>
</html>

表單標(biāo)簽

標(biāo)簽描述
<form>定義供用戶(hù)輸入的表單
<input>定義輸入域
<textarea>定義文本域 (一個(gè)多行的輸入控件)
<label>定義一個(gè)控制的標(biāo)簽
<fieldset>定義域
<legend>定義域的標(biāo)題
<select>定義一個(gè)選擇列表
<optgroup>定義選項(xiàng)組
<option>定義下拉列表中的選項(xiàng)
<button>定義一個(gè)按鈕
<isindex>已廢棄。由 <input> 代替。


Previous article： Next article：