HTML5现在越来越火了，很多人都想学习HTML5，但是HTML5比旧版的多了些新的表单元素，现在就让我们来看看新增的都有哪些表单元素吧。HTML5新增常用的表单元素有哪些？分别怎么使用的？
本章介绍以下新的表单元素：datalist；keygen；output
datalist 元素：
datalist 元素规定输入域的选项列表。
列表是通过 datalist 内的 option 元素创建的。
如需把 datalist 绑定到输入域，请用输入域的 list 属性引用 datalist 的 id：
Webpage: <input type=url list=url_list name=link /> <datalist id=url_list> <option label=双恒网络 value=http://www.gree020.cn /> <option label=Google value=http://www.google.com /> <option label=Microsoft value=http://www.microsoft.com /> </datalist>
提示：option 元素永远都要设置 value 属性。
keygen 元素：
keygen 元素的作用是提供一种验证用户的可靠方法。
keygen 元素是密钥对生成器（key-pair generator）。当提交表单时，会生成两个键，一个是私钥，一个公钥。
私钥（private key）存储于客户端，公钥（public key）则被发送到服务器。公钥可用于之后验证用户的客户端证书（client certificate）。
目前，浏览器对此元素的糟糕的支持度不足以使其成为一种有用的安全标准。
<form action=demo_form.asp method=get> Username: <input type=text name=usr_name /> Encryption: <keygen name=security /> <input type=submit /> </form>
output 元素：
output 元素用于不同类型的输出，比如计算或脚本输出：
<output id=result onforminput=resCalc()></output>
Input 类型：
HTML5拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。
1.Input 类型- email
email 类型用于应该包含e-mail 地址的输入域。在提交表单时，会自动验证email 域的值。
2.Input 类型- url
url 类型用于应该包含URL 地址的输入域。在提交表单时，会自动验证url 域的值。
3.Input 类型- number
number 类型用于应该包含数值的输入域。您还能够设定对所接受的数字的限定：
4.Input 类型- range
range 类型用于应该包含一定范围内数字值的输入域。
range 类型显示为滑动条。
您还能够设定对所接受的数字的限定：
5.Input 类型- Date Pickers（数据检出器）
HTML5 拥有多个可供选取日期和时间的新输入类型：
date – 选取日、月、年
month – 选取月、年
week – 选取周和年
time – 选取时间（小时和分钟）
datetime – 选取时间、日、月、年（UTC 时间）
datetime-local – 选取时间、日、月、年（本地时间）
6.Input 类型- search
search 类型用于搜索域，比如站点搜索或Google 搜索。
search 域显示为常规的文本域。
16af92afd8c97b30ffbcda2e1ce36f1e
ff9c23ada1bcecdd1a0fb5d5a0f18437定义供用户输入的表单
d5fd7aea971a85678ba271703566ebfd定义输入域
4750256ae76b6b9d804861d8f69e79d3定义文本域（一个多行的输入控件）
2e1cf0710519d5598b1f0f14c36ba674定义一个控制的标签
02609e582fd7962059acb31154de1a92定义域
e911751791aa3ba95dc724e2fb905976定义域的标题
221f08282418e2996498697df914ce4e定义一个选择列表
5b7a15bed8615d1b843806256bebea72定义选项组
5a07473c87748fb1bf73f23d45547ab8定义下拉列表中的选项
bb9345e55eb71822850ff156dfde57c8定义一个按钮
【相关文章】
HTML和HTML5的发展历史
html的基础元素，让你零基础学习HTML
以上就是HTML5新增常用的表单元素有哪些？附使用实例的详细内容，更多请关注双恒网络其它相关文章！
2. 分享目的仅供大家学习和交流，您必须在下载后24小时内删除！
3. 不得使用于非法商业用途，不得违反国家法律。否则后果自负！
4. 本站提供的源码、模板、插件等等其他资源，都不包含技术服务请大家谅解！
5. 如有链接无法下载、失效或广告，请联系管理员处理！
6. 本站资源售价只是赞助，收取费用仅维持本站的日常运营所需！
7. 如遇到加密压缩包，请使用WINRAR解压,如遇到无法解压的请联系管理员！
8. 精力有限，不少源码未能详细测试（解密），不能分辨部分源码是病毒还是误报，所以没有进行任何修改，大家使用前请进行甄别
9.本站默认解压密码为:www.sudo1.com
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的。
不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站信息来自网络收集整理，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑或手机中彻底删除上述内容。
如果您喜欢该程序和内容，请支持正版，购买注册，得到更好的正版服务。
我们非常重视版权问题，如有侵权请邮件与我们联系处理。敬请谅解！
云资源网 » HTML5新增常用的表单元素有哪些？附使用实例
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用？
- 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了？
- 你们有qq群吗怎么加入？
