首页 > 代码库 > html5-新元素

html5-新元素

1.url:

 <input type="url"/>

技术分享

2.搜索框 :search

 <input type="search"/>

3.电话号码输入框:tel

 <input type="tel"/>

4.数值输入框:number

 <input type="number" step="0.1" min="0" max="100"/>

5.滑动条:range

<input type="range" min="0" max="100" value="http://www.mamicode.com/10">

 6:日期控件:date

<input type="date" value="http://www.mamicode.com/2016-01-04">

7:时间控件:time

<input type="time" value="http://www.mamicode.com/13:12">

<input type="time" value="http://www.mamicode.com/13:12:45">

 8:日期时间控件:datetime-local

<input type="datetime-local" value="http://www.mamicode.com/2016-12-14T13:12:12">

9:月控件:month

<input type="month" value="http://www.mamicode.com/2016-9">

10:周控件

<input type="week" value="http://www.mamicode.com/2016-W03">

11:颜色选择器:color

<input type="color" value="http://www.mamicode.com/#2D9900">

 12:输入框输入提示<datalist>

<input id="site" list="siteID">

<datalist id="siteID">

       <option value="http://www.mamicode.com/baidu1" label="baidu1">

       <option value="http://www.mamicode.com/baidu2" label="baidu2">

       <option value="http://www.mamicode.com/baidu3" label="baidu3">

       <option value="http://www.mamicode.com/baidu4" label="baidu4">

</datalist>     

 

13:进度条 progress

<progress value="http://www.mamicode.com/0.25" max="100">25%</progress>

 

14:计量条 :meter

<meter value="http://www.mamicode.com/50" min="10" max="70" low="30" high="60">

 15:页面可编辑 contenteditable="true"

     <div style="width:240px;height:100px;contenteditable="true">你可以编辑这段文本</div> 

 

 

 

 

 

 

 

 

 

html5-新元素