新增表单控件和表单属性

新增表单控件和表单属性

Forms

　　新的输入型控件

　　　　email: 电子邮箱文本框，跟普通的没什么区别

　　　　　　-当输入不是邮箱的时候，验证不通过

  案例<form>

　　　　<input type="email" />

　　　　<input type="submit" /> 当输入的不是邮箱的时候.点击提交后就会有提示

　　　　　　tel:电话号码

　　　　tel的功能主要在移动端,一个键盘的切换

　　　　url: 网页的url

　　　　<form>

　　　　　　<input type="url" />

　　　　　　<input type="submit" />

　　　　</form>  这是一个提交网址的输入框  如果写的不是和网址一样的文字就会提示你请输入网址

　　search :搜索引擎

　　谷歌下输入文字后  会多出一个关闭的x

　　　　

　　　　<form>

 

　　　　　　<input type="search" />

 

　　　　　　<input type="submit" />

 

 　　　　</form>

 range 特定范围内的数值选择器

　　　　-min max step(步数)

　　　　-例子 用js来显示当前数值

   <form>

　　<input type="range"step="2" min="0 value=""2" />

　　　　<input type="submit" />

   </form>  就相当于滚动条和滑动条  可以设置滑动的距离和步数  以及它的最大值和最小值

number  只能包含数字的输入框

 <form>

  <input type=""number" />

　　<input type="submit" />   就只能写数字不能写除数字以外的东西

  </form>

color 颜色选择器

   <form>

　　　　<input type="color" />

　　　　<input type="submit">    可以自定义颜色

　　</form>     

datetime :显示完整日期

 <form>

　　<input type="datetime" />

　　<input type="submit" /> Opera 浏览器下作用   在谷歌下可以自定义的选择日期

</form>

detatime-local：显示完整日期不含时区

<form>

　　<input type="datetime-local" />

　　<input type="submit">   显示完整日期  不含时区  具体到几几年几月几日

</form>

time ： 显示时间,不含时区

<form>

   <input type="time" />

　　<input type="submit" /> 只有现实时间 

</form>

date :显示日期

<form>

　　<input type="date" />

　　<input type="submit">  只显示日期

</form>

week  显示周

 <form>

　　<input type="date" />

　　<input type="submit" />   日期只会显示到周期

<form>

month ：显示月

 <form>

　　<input type="date" />

　　<input type="submit" /> 具体显示到月

</form>