<input> 元素

最重要的表單元素是 <input> 元素。

<input> 元素根據(jù)不同的 type 屬性，可以變化為多種形態(tài)。

注釋?zhuān)合乱徽轮v解所有 HTML 輸入類(lèi)型。

<select> 元素（下拉列表）

<select> 元素定義下拉列表：

實(shí)例

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

<option> 元素定義待選擇的選項(xiàng)。

列表通常會(huì)把首個(gè)選項(xiàng)顯示為被選選項(xiàng)。

您能夠通過(guò)添加 selected 屬性來(lái)定義預(yù)定義選項(xiàng)。

實(shí)例

<option value="fiat" selected>Fiat</option>

<textarea> 元素

<textarea> 元素定義多行輸入字段（文本域）：

實(shí)例

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

以上 HTML 代碼在瀏覽器中顯示為：

The cat was playing in the garden.

<button> 元素

<button> 元素定義可點(diǎn)擊的按鈕：

實(shí)例

<button type="button" onclick="alert('Hello World!')">Click Me!</button>

以上 HTML 代碼在瀏覽器中顯示為：

HTML5 表單元素

HTML5 增加了如下表單元素：

• <datalist>
• <keygen>
• <output>

注釋?zhuān)耗J(rèn)地，瀏覽器不會(huì)顯示未知元素。新元素不會(huì)破壞您的頁(yè)面。

HTML5 <datalist> 元素

<datalist> 元素為 <input> 元素規(guī)定預(yù)定義選項(xiàng)列表。

用戶會(huì)在他們輸入數(shù)據(jù)時(shí)看到預(yù)定義選項(xiàng)的下拉列表。

<input> 元素的 list 屬性必須引用 <datalist> 元素的 id 屬性。

實(shí)例

通過(guò) <datalist> 設(shè)置預(yù)定義值的 <input> 元素：

<form action="action_page.php">
<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
</datalist> 
</form>