HTML模版.doc

HTML5是WEB技术发展的重要的里程碑，对于前端开发来说，如果能够找到一些未来大家开发中可能需要经常重复使用的代码的话，相信大家一定不会拒绝，下面是我们精心收集的10多个HTML5代码片段，相信大家一定喜欢！ HTML5的最简单模板 如果你需要开始一个新的HTML5项目的话，大家肯定会需要一个最简单的模板，这里是一个非常简单并且清晰的HTML5模板，相信大家会喜欢！ !DOCTYPE htmlhtml head meta charset=utf-8 titleUntitled/title !--[if lt IE 9] script src=/svn/trunk/html5.js/script ![endif]-- /head body web的主要内容 /body/html 表单获取Google地图 这里有一段非常简单的代码，通过用户输入地点，获取google地图地点，非常适合生成联系人表单 form action=/maps method=get target=_blank label for=saddr输入地点/label input type=text name=saddr / input type=hidden name=daddr value=350 5th Ave New York, NY 10018 (Empire State Building) / input type=submit value=Get directions //form Base64编码的1x1大小的空白GIF文件 个人不推荐使用这个透明的空白gif，但是即使在2013年，很多人仍旧使用。可能你也喜欢使用这种方式。 img src=data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 正则表单式验证电子邮件 HTML5中允许使用正则表单式来做输入验证： input type=text title=email required pattern=[^@]+@[^@]+\.[a-zA-Z]{2,6} / 正确的嵌入flash 如果你经常需要在网页中插入flash的话，这段代码你应该用的上： object type=application/x-shockwave-flash  data=your-flash-file.swf  width=0 height=0 param name=movie value=your-flash-file.swf / param name=quality value=high//object 视频并且支持flash的fallback 另外一个HTML5中最有用的特性是video标签，允许你很方便的嵌入video文件。但是很多老版本的浏览器不支持，所以下面这段代码将会非常有用 video width=640 height=360 controls source src=__VIDEO__.MP4 type=video/mp4 / source src=__VIDEO__.OGV type=video/ogg / object width=640 height=360 type=application/x-shockwave-flash data=__FLASH__.SWF param name=movie value=__FLASH__.SWF / param name=flashvars value=controlbar=overamp;image=__POSTER__.JPGamp;file=__VIDEO__.MP4 / img src=__VIDEO__.JPG width=640 height=360 alt=__TITLE__ title=No video playback capabilities, please download the video below / /object/video iPhone call sms links iphone中苹果介绍了一个非常方便的方式来创建电话和短信链接。代码如下： a href=tel:1-408-555-55551-408-555-5555/aa href=sms:1-408-555-1212New SMS Message/a HTML5的数据自动补齐功能 使用datalist元素，HTML5允许使用一组数据来生成自动补齐功能，现在你不需要使用第三方js代码或者类库啦！ input name=framewor