名站网址导航名站网址导航小编为爱好网页hTML5的朋友提供关于网页hTML5的相关知识。
- 本篇文章的具体介绍如下
网页hTML5教程是WEB技术发展的重要的里程碑，对于前端开发建设来说，如果能够找到一些未来大家开发建设中可能需要经常重复使用的具体代码的话，相信大家一定不会拒绝，下面是咱们精心收集的9个网页hTML5教程具体代码片段，相信大家一定喜欢！
网页hTML5教程的最简单模板
如果您需要开始一个新的网页hTML5教程项目的话，大家肯定会需要一个最简单的模板，这里是一个非常简单并且清晰的网页hTML5教程模板，相信大家会喜欢！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
web的主要内容
</body>
</html>
表单获取Google地图
这里有一段非常简单的具体代码，通过用户输入地点，获取google地图地点，非常适合生成联系人表单
<form action="http://maps.google.com/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=over& image=__POSTER__.JPG&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-5555">1-408-555-5555</a> <a href="sms:1-408-555-1212">New SMS Message</a>
网页hTML5教程的数据自动补齐功能
使用datalist网页元素，网页hTML5教程允许使用一组数据来生成自动补齐功能，现在您不需要使用第三方js具体代码或者类库啦！
<input name="frameworks" list="frameworks" /> <datalist id="frameworks"> <option value="MooTools"> <option value="Moobile"> <option value="Dojo Toolkit"> <option value="jQuery"> <option value="YUI"> </datalist>
可直接下载相关站点文件
<!-- will download as "expenses.pdf" --> <a href="/files/adlafjlxjewfasd89asd8f.pdf" download="expenses.pdf">Download Your Expense Report</a>
关于网页hTML5的相关知识就说到这里希望可以帮助朋友们。,9个,值得,收藏,的,实用,网页hTML5,代码,片段,分享,网页hTML5教程的网页元素嵌套规则
当然，我是不会告诉您这段具体代码来自于FACEBOOK的 ，各位认为以上网页元素的嵌套有没有问题呢？咱们会在后面讨论这个。
