Inpute類(lèi)型:color

color類(lèi)型用在input字段主要用于選取顏色，如下所示：

 !DOCTYPE HTML  html  head  meta charset= utf-8 /  title 自選教程(如約智惠.com) /title  /head  body  form action= demo-form.php  選擇你喜歡的顏色： input type= color name= favcolor br /  input type= submit  /form  /body  /html 

Input類(lèi)型：date

date類(lèi)型允許你從一個(gè)日期選擇器選擇一個(gè)日期。

 !DOCTYPE HTML  html  head  meta charset= utf-8 /  title 自選教程(如約智惠.com) /title  /head  body  form action= demo-form.php  input type= date name= bday br /  input type= submit  /form  /body  /html 

Input類(lèi)型：datetime

datetime類(lèi)型允許你選擇一個(gè)日期(UTC時(shí)間)

 !DOCTYPE HTML  html  head  meta charset= utf-8 /  title 自選教程(如約智惠.com) /title  /head  body  form action= demo-form.php  生日(日期和時(shí)間)： input type= datetime name= bdaytime br /  input type= submit  /form  /body  /html 

Input類(lèi)型：datetime-local

datetime-local類(lèi)型允許你選擇一個(gè)日期和時(shí)間(無(wú)時(shí)區(qū))

 !DOCTYPE HTML  html  head  meta charset= utf-8 /  title 自選教程(如約智惠.com) /title  /head  body  form action= demo-form.php  生日(日期和時(shí)間)： input type= datetime-local name= bdaytime br /  input type= submit  /form  /body  /html 

Input類(lèi)型：email

email類(lèi)型用于應(yīng)該包含e-mail地址的輸入域

 !DOCTYPE HTML  html  head  meta charset= utf-8 /  title 自選教程(如約智惠.com) /title  /head  body  form action= demo-form.php  E-mail： input type= email name= usremail br /  input type= submit  /form  /body  /html 

Input類(lèi)型:month

month類(lèi)型允許你選擇一個(gè)月份

生日 (月和年): input type= month name= bdaymonth 

number 類(lèi)型用于應(yīng)該包含數(shù)值的輸入域。

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

定義一個(gè)數(shù)值輸入域(限定):

數(shù)量 ( 1 到 5 之間 ): input type= number name= quantity min= 1 max= 5 

使用下面的屬性來(lái)規(guī)定對(duì)數(shù)字類(lèi)型的限定：

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

range 類(lèi)型顯示為滑動(dòng)條。

定義一個(gè)不需要非常精確的數(shù)值（類(lèi)似于滑塊控制）:

 input type= range name= points min= 1 max= 10 

請(qǐng)使用下面的屬性來(lái)規(guī)定對(duì)數(shù)字類(lèi)型的限定：

max - 規(guī)定允許的最大值

min - 規(guī)定允許的最小值

step - 規(guī)定合法的數(shù)字間隔

value - 規(guī)定默認(rèn)值

search 類(lèi)型用于搜索域，比如站點(diǎn)搜索或 Google 搜索。

定義一個(gè)搜索字段 (類(lèi)似站點(diǎn)搜索或者Google搜索):

Search Google: input type= search name= googlesearch 

定義輸入電話(huà)號(hào)碼字段:

電話(huà)號(hào)碼: input type= tel name= usrtel 

time 類(lèi)型允許你選擇一個(gè)時(shí)間。

定義可輸入時(shí)間控制器（無(wú)時(shí)區(qū)）：

選擇時(shí)間: input type= time name= usr_time 

url 類(lèi)型用于應(yīng)該包含 URL 地址的輸入域。

在提交表單時(shí)，會(huì)自動(dòng)驗(yàn)證 url 域的值。

定義輸入U(xiǎn)RL字段:

添加您的主頁(yè): input type= url name= homepage 

提示: iPhone 中的 Safari 瀏覽器支持 url 輸入類(lèi)型，并通過(guò)改變觸摸屏鍵盤(pán)來(lái)配合它（添加 .com 選項(xiàng)）。

week 類(lèi)型允許你選擇周和年。

定義周和年 (無(wú)時(shí)區(qū)):

選擇周: input type= week name= week_year 

注意:并不是所有的主流瀏覽器都支持新的input類(lèi)型，不過(guò)您已經(jīng)可以在所有主流的瀏覽器中使用它們了。即使不被支持，仍然可以顯示為常規(guī)的文本域。

相關(guān)推薦：

讓IE支持HTML5的方法

HTML5離線(xiàn)應(yīng)用與客戶(hù)端存儲(chǔ)的實(shí)現(xiàn)

以上就是HTML5 新的Input類(lèi)型的詳細(xì)內(nèi)容，html教程

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