<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form action="javascript:;">
    颜色：<label><input type="color"></label><br><br>
    邮箱：<label><input type="email"></label><br><br>
    手机：<label><input type="tel"></label><br><br>
    数字：<label><input type="number"></label><br><br>
    url：<label><input type="url"></label><br><br>
    搜索：<label><input type="search"></label><br><br>
    区域：<label><input type="range"></label><br><br>
    年月日：<label><input type="date"></label><br><br>
    月份：<label><input type="month"></label><br><br>
    星期：<label><input type="week"></label><br><br>
    时间：<label><input type="time"></label><br><br>
    <input type="submit" value="提交">
</form>
<br><br><br><br>
<form action="javascript:;">
    姓名1：<label><input type="text" autofocus></label><br><br>
    姓名2：<label><input type="text" autofocus required></label><br><br>
    <input type="submit" value="提交">
</form>
</body>
</html>

运行结果：

HTML：H5新增表单type属性_搜索