HTML5新增input类型及其属性

1.在其他版本的HTML中，表单包含的元素非常有限，并且属性也不多，尤其是在数据交互过程中数据的验证需要编写大量的JavaScript代码

2.以上的不足都已经在HTML5中被克服，HTML5在以上的基础上增加了许多标签和属性，为开发人员带来了极大的方便

电子邮件类型
功能描述：输入E-mail地址的文本框
语法：<input type="email"/>
注意：输入的内容中必须包含"@"，"@"后面必须具有内容

搜索类型
功能描述：输入搜索关键字的文本框
语法：<input type="search"/>

URL类型
功能描述：输入WEB站点的文本框
语法：<input type="url"/>
注意：输入的内容中必须包含"http://"，后面必须有内容

颜色类型
功能描述：预定义的颜色拾取控件
语法：<input type="color"/>

数字类型
功能描述：只能接受数字
语法：<input type="number"/>
属性：min：当前域能接受的最小值
max：当前域能接受的最大值
step：决定了域所接受值递增或递减的步长，默认为1

范围类型
功能描述：允许用户选择一个范围内的值
语法：<input type="range" min="0" max="100" value="80"/>
属性：min：范围的下限值
max：范围的上限值
step：声明该值递增或递减的步长
value：设置初始值

日期类型
功能描述：创建一个日期输入域
语法：<input type="date" />

周类型
功能描述：与date类型相似，但只能选择周
语法：<input type="week" />

月份类型
功能描述：与date类型相似，但只能选择月份
语法：<input type="month" />

HTML5新增属性

placeholder
作用：默认提示
语法：

<input type="text" placeholder="请输入用户名"/>

multiple
作用：支持在一个域中输入多个值，逗号隔开，一般配合邮箱和URL使用
语法：<input type="email" multiple/>

autofocus
作用：自动获取焦点
语法：<input type="text" autofocus/>

required
作用：防止域为空提交表单时
语法：<input type="text" required/>

minlength和 maxlength
作用：定制元素允许的最小字符数和最大字符数
语法：<input type="text" minlength="6" maxlength="18"/>

min和max
作用：定制元素允许的最小数字和最大数字
语法：<input type="number" min=”0” max=”100”/>