html5的新特性
html5的新特性一、新的Doctype
XHTML文档类型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www。w3。org/TR/xhtml1/DTD/xhtml1-transitional。dtd">
HTML5文档类型
<!DOCTYPE html>
二、<small>重新定义
<small>元素已经被重新定义了，指小字，因而更具可用性。试想下你网站底部的版权状态，根据对此元素新的HTML5定义，<small>可以正确地包裹这些信息。
三、脚本(scripts)和链接(links)无需type
这意味着，这些标签都各自指向样式表和脚本。因此，我们可以把type属性一起干掉。
<link rel="stylesheet" href="path/to/stylesheet。css" />
<script src="path/to/script.js"></script>
四、引号还是不要引号
HTML5不是XHTML，要是你不愿意，你没有必要非得用引号标记包裹你的属性，没有必要非得闭合元素。换句话说，只要你自己觉得舒服，就没有什么对错之分。
五、语义的Header和Footer
通过HTML5，我们可以使用<header>和<footer>元素
<header>
...
</header>
<footer>
...
</footer>
它完全适合您有多个页眉和页脚的项目。
尽量不要混淆”header”和”footer”这些元素。他们只是指他们的容器。因此，将博客底部的，例如，元信息放在footer元素内部是说得通的。这同样也适用于header。
六、文档某一部分的信息(hgroup)
<header>
<hgroup>
<h1> Recall Fan Page </h1>
<h2> Only for people who want the memory of a lifetime. </h2>
</hgroup>
</header>
七、Autofocus属性
HTML5的解决方案消除了对JavaScript的需要。如果一个特定的输入应该是“选择”，或有重点的，默认情况下，我们现在可以利用自动获取焦点属性。
<input type="text" name="someInput" placeholder="zhangxinxu" required autofocus>
八、Audio支持
我们无需再依赖第三方插件区渲染音频。HTML5提供了<audio>元素，嗯，至少，最终，我们将不必担心这些插件。就目前，只有最近期的的浏览器提供HTML5音频支持。在这个时候，它仍然是一个很好的做法提供一些向后兼容的形式。
<audio autoplay="autoplay" controls="controls">
<source src="file。ogg" />
<source src="file。mp3" />
<a href="file。mp3">Download this file.</a>
</audio>
Mozilla和WebKit的还没有完全相处，当涉及到音频格式， Firefox会希望看到一个.ogg文件，而WebKit的浏览器支持.mp3扩展。这意味着，至少在现在，你应该创建两个版本的音频。
当Safari加载页面时，它不会承认.ogg格式，会跳过它并移动到的MP3版本，因此。请注意IE，每往常一样，不支持这些格式，Opera 10和以及以下版本只能使用.wav文件。
九、Video支持
与<audio>元素很类似，在新的浏览器中也存在Video！事实上，就在最近，YouTube宣告了新的HTML5视频嵌入，当然，是为支持此功能浏览器。因为HTML5的规范没有指定特定的视频编解码器，它留给了浏览器来决定。虽然Safari和Internet Explorer9可以预期支持H.264格式的视频（其中Flash播放器可以播放），Firefox和Opera是坚持开源Theora 和Vorbis格式。因此，当显示HTML5的视频，您必须提供这两种格式。
<video controls preload>
<source src="cohagenPhoneCall.。ogv" type="video/ogg; codecs='vorbis, theora'" />
<source src="cohagenPhoneCall。mp4" type="video/mp4; 'codecs='avc1.42E01E, mp4a.40.2'" />
<p> Your browser is old. <a href="cohagenPhoneCall。mp4">Download this video instead.</a> </p>
</video>
十、mark元素(Mark Element )
试想<mark>元素作为高亮。此标签包裹的字符串应该与用户当前的行动相关联。例如，我在一些博客上搜索“北川景子”，我就可以使用一些JavaScript将当前的每个结果字符串用mark标签包裹。
<h3> 搜索结果 </h3>
<p> 我很喜欢《零秒出手》里面那个拉小提琴的女孩，原来她叫做 <mark>北川景子</mark>。 </p>
十一、data属性(The Data Attribute)
以前，我们可能会这样：
<h1 id=someId customAttribute=value> 小样，胆儿挺肥的呢 </h1>
校验器会小题大做！但是现在，只要我们以”data”为前缀定义我们的自定义属性，盗版属性立马变成正牌的了。如果你发现你曾经把一个重要的数据附加在诸如class的属性上，可能为了JavaScript之用，那么，本属性将大有帮助啊。
<li id="myli" data-custom-attr="My Value"> 大家好</li>