表單

編輯

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

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

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

form input / /form

Input類型

編輯

HTML5擁有多個新的表單輸入類型。這些新特性提供了更好的輸入控制和驗證。

1.Input 類型- email

email 類型用于應(yīng)該包含e-mail 地址的輸入域。在提交表單時，會自動驗證email 域的值。

2.Input 類型- url

url 類型用于應(yīng)該包含URL 地址的輸入域。在提交表單時，會自動驗證url 域的值。

3.Input 類型- number

number 類型用于應(yīng)該包含數(shù)值的輸入域。您還能夠設(shè)定對所接受的數(shù)字的限定：

4.Input 類型- range

range 類型用于應(yīng)該包含一定范圍內(nèi)數(shù)字值的輸入域。

range 類型顯示為滑動條。

您還能夠設(shè)定對所接受的數(shù)字的限定：

5.Input 類型- Date Pickers（數(shù)據(jù)檢出器）

HTML5 擁有多個可供選取日期和時間的新輸入類型：

date - 選取日、月、年

month - 選取月、年

week - 選取周和年

time - 選取時間（小時和分鐘）

datetime - 選取時間、日、月、年（UTC 時間）

datetime-local - 選取時間、日、月、年（本地時間）

6.Input 類型- search

search 類型用于搜索域，比如站點搜索或Google 搜索。

search 域顯示為常規(guī)的文本域。

輸入

編輯

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

文本域

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

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

瀏覽器顯示如下：

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

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

 form  input type= radio name= sex html' target='_blank'>value= male Male input type= radio name= sex value= female Female /form 

瀏覽器顯示如下：

MaleFemale

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

如圖：

復(fù)選框

當(dāng)用戶需要從若干給定的選擇中選取一個或若干選項時，就會用到復(fù)選框（checkboxes)。

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

瀏覽器顯示如下：

I have a bikeI have a car

其他組成

編輯

確認(rèn)按鈕

當(dāng)用戶單擊確認(rèn)按鈕(submit)時，表單的內(nèi)容會被傳送到另一個文件。[1]

動作屬性

表單的動作屬性(action)定義了目的文件的文件名。由動作屬性定義的這個文件通常會對接收到的輸入數(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)鍵入幾個字母，并且點擊確認(rèn)按鈕，那么輸入數(shù)據(jù)會被傳送到名為 html_form_action.asp 的頁面。那一頁將顯示出輸入的結(jié)果。

表單標(biāo)簽

【相關(guān)推薦】

1. HTML免費視頻教程

2. 詳解form表單的工作過程

3. 詳解form標(biāo)簽中的method屬性

4. 帶你掌握HTML中table和form表單

5. 詳解html中form表單的參數(shù)和屬性

以上就是HTML表單的詳細(xì)介紹的詳細(xì)內(nèi)容，html教程

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。