脚本宝典收集整理的这篇文章主要介绍了html5教程-HTML5表单-form实战解析，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。 由于目前html5标准仍然在开发中，不同的浏览器对HTML5特性的支持都相当有限。其中chrome、Opera在表单方面支持得比较好，本实例在chrome、Opera上运行一切正常，建议最高版本，效果图如下：
 
 

 
 
这个表单使用哪些新元素类型及功能？
 
 
type类型
我们熟悉type就是text、password、submit、reset。
这个例子中使用了input的HTML5所赋予新类型email(邮箱)、range（数值条）、number（数字）、date（日期）、url（网址）
type类型的详细介绍请参考本站：全新改进的HTML5 表单创建
 
placeholder（输入框占位符）
一个input默认提示文字，我们需要通过事件属性来实现或者简单的js代码，在html5中一切就会变的这么简单，只需要加上placeholder="输入框占位符"，即可实现你想要的效果。
 
datalist（选项列表）
w3c赋予的解释：
<datalist> 标签定义选项列表。请与input 元素配合使用该元素，来定义input 可能的值。
datalist 及其选项不会被想显示出来，它仅仅是合法的输入值列表。
请使用input 元素的list 属性来绑定datalist。
 
<input id="myCar" list="cars" /> 
<datalist id="cars"> 
  <option value="BMW"> 
  <option value="Ford"> 
  <option value="Volvo"> 
</datalist> 
不过支持这个属性的只有Opera浏览器

觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ html5教程，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的html5教程-HTML5表单-form实战解析全部内容，希望文章能够帮你解决html5教程-HTML5表单-form实战解析所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。