HTML5还有一些新增的input类型:
email:电子邮件地址文本框，提交表单时会自 动验证email的值。
url:网页的URL，提交表单时会自动验证url的 值。
color:主要用于选取颜色。
search:用于搜索引擎(搜索框)。
number:只包含数值的字段，能够设定对所接 受的数字限定。
range:滑动条，特定值范围内的数值选择器。
例:
<body>
<form action="">
<input type="email" placeholder="请输入邮箱">
<br>
<button>提交</button>
<br>
<input type="url" placeholder="请输入网址">
<br>
<input type="color">
<br>
<input type="search">
</form>
</body>
<input type="number" name="num" min="4" max="20" step="2" value="10">
属性 值 说明
max number 规定允许的最大值
min number 规定允许的最小值
step number 规定合法的数字间隔 (每次增加的数字量)
value number 规定的默认值
<input type="range" name="point" min="2" max="15" step="1" value="7">
属性 值 说明
max number 规定允许的最大值
min number 规定允许的最小值
step number 规定合法的数字间隔
value number 规定的默认值
input类型——Date pickers
类型 说明
date 选择日,月,年
month 选择月,年
week 选择周和年
time 选择时间，小时和分钟
datetime-local 选择本地时间
<body>
<form action="">
<div>年月日：<input type="date"></div>
<div>年月： <input type="month"></div>
<div>年周： <input type="week"></div>
<div>小时和分钟：<input type="time"></div>
<div>本地时间：<input type="datetime-local"></div>
</form>
</body>
还有一些新增属性:
属性 说明
autofocus 页面加载时自动获得焦点
required 规定输入与那不能为空，必 填项。
placeholder 提供一种提示，描述输入域所 期待的值。
pattern 规定验证input域的模式。
height,width 仅适用于image类型的input 标签的图像高度和宽度。
(required的效果)
输入的时候如果不想出现默认框，可以去掉默认框:
<style>
input{
outline: none;
}
</style>