html標籤---input屬性

一個簡單的 HTML 表單，包含兩個文本輸入框和一個提交按鈕：

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

定義和用法

<input> 標籤用於蒐集用戶信息。

根據不一樣的 type 屬性值，輸入字段擁有不少種形式。輸入字段能夠是文本字段、複選框、掩碼後的文本控件、單選按鈕、按鈕等等。

HTML 與 XHTML 之間的差別

在 HTML 中，<input> 標籤沒有結束標籤。

在 XHTML 中，<input> 標籤必須被正確地關閉。

提示和註釋：

提示：請使用 label 元素爲某個表單控件定義標籤。

input屬性

• 文本域(Text fields)

• 本例演示如何在 HTML 頁面建立文本域。用戶能夠在文本域寫入文本。

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

• 密碼域

• 本例演示如何建立 HTML 的密碼域。

<form>
用戶：
<input type="text" name="user">
<br />
密碼：
<input type="password" name="password">
</form>
<p>
請注意，當您在密碼域中鍵入字符時，瀏覽器將使用項目符號來代替這些字符。
</p>

• 複選框

• 本例演示如何在 HTML 頁中建立文本框。用戶能夠選中或取消選取複選框。

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

• 單選按鈕

• 本例演示如何在 HTML 中建立單選按鈕。

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

<p>當用戶點擊一個單選按鈕時，該按鈕會變爲選中狀態，其餘全部按鈕會變爲非選中狀態。</p>

• 簡單的下拉列表

• 本例演示如何在 HTML 頁面中建立簡單的下拉列表框。下拉列表框是一個可選列表。

<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>

• 建立按鈕

• 本例演示如何建立按鈕。你能夠對按鈕上的文字進行自定義。

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