<html>
<head>
<title>新型input类型及表单新元素</title>
<meta charset="utf-8">
</head>
<body>
<!-- input新类型 列出一部分-->
<form action="">
选择你喜欢的颜色: <input type="color" name="favcolor">
生日: <input type="date" name="bday">
生日 (日期和时间): <input type="datetime" name="bdaytime">
生日 (日期和时间): <input type="datetime-local" name="bdaytime">
E-mail: <input type="email" name="email">
生日 (月和年): <input type="month" name="bdaymonth">
数量 ( 1 到 5 之间 ): <input type="number" name="quantity" min="1" max="5">
电话号码: <input type="tel" name="usrtel">
添加您的主页: <input type="url" name="homepage">
</form>
<!-- 表单新元素 不是所有的浏览器都支持HTML5
新的表单元素，但是你可以在使用它们
，即使浏览器不支持表单属性，仍然可以显示
为常规的表单元素。-->
<!-- datalist
与select区别
1.能模糊搜索
2.可由用户输入
-->
<input list="browser" name="browser">
<datalist id="browser">
<option value="ie"></option>
<option value="safari"></option>
<option value="opera"></option>
<option value="firefox"></option>
</datalist>
<!-- keygen
提供一种验证用户的可靠方法
当提交表单时，会生成两个键，一个是私钥，一个公钥。
-->
<form action="" method="get">
用户名: <input type="text" name="usr_name">
加密: <keygen name="security">
<input type="submit">
</form>
<!-- output
用于不同类型的输出
-->
<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100 +
<input type="number" id="b" value="50">=
<output name="x" for="a b"></output>
</form>
</body>
</html>