HTML5拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。

HTML5新的Input类型有:email  ,   url   ,   number  ,   range  ,  Date pickers(date,month,week,time,datetime,datetime-local)  ,  search  ,  color

html5input默认内容 html5新的input类型_搜索

email类型用于应该包含e-mail地址的输入域。
在提交表单时,会自动验证email域的值。
<input type="email" name="user_email"/>
 
url类型用于应该包含URL地址的输入域。
在提交表单时,会自动验证url域的值。
<input type="url" name="user_url"/>
 
number类型用于应该包含数值的输入域。
您还能够设定对所接受的数字的限定。
<input type="number" name="points" min="1" max="10" step="3" value="6"/>

html5input默认内容 html5新的input类型_html5 input 类型 支持_02

 

range类型用于应该包含一定范围内数字值的输入域。

range类型显示为滑动条。

还可以设定对所接受的数字的限定。

<input type="range" name="points" min="1" max="10"/>

html5input默认内容 html5新的input类型_html5 input 类型 支持_03

 

Date Pickers(数据检出器)

HTML5拥有多个可供选取日期和时间的新输入类型:

date - 选取日,月,年

month - 选取月,年

week - 选取周和年

time - 选取时间(小时和分钟)

datetime - 选取时间,日,月,年(UTC时间)

datetime-local - 选取时间,日,月,年(本地时间)

<input type="date" name="user_date"/>

 

search类型用于搜索域,比如站点搜索或Google搜索。

search域显示为常规的文本域。