此文主要适读人群：梦想成为前端工程师的你！
html5万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改（W3CRecommendation）。
2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，该标准规范终于制定完成。
然而，html5的出现并没有很快得到各大pc端浏览器的充分支持和兼容。主要表现在对火狐和IE浏览器的不兼容。如果想具体了解兼容问题，可参考如下文章：html5兼容性，当然关于html5兼容性的文章现在有许多，由于篇幅有限，这里就不再详叙，大家可以自行问度娘和谷爹。
但是，随着移动互联网的出现和兴盛，html5新标签和新属性的优势逐渐显现，移动端浏览器对html5支持的较为充分。特别是在混合类移动端app上面，html5也得到了广泛的应用。最终html5构建的页面以其炫酷优雅的步伐，逐渐赢得了广大开发者青睐。
所以，在讨论html5新标签之前，希望大家明白，html5的出现主要的适应了移动端的发展趋势。好了，废话不多说多了，直接上手看看html5带来了哪些重要的新标签和属性吧。
一、书写规范
1、文档类型声明
以前我们的写页面前 需要先写上类似如下复杂的声明：
<!DOCTYPE HTML PUBLIC " -//W3C//DTD HTML 4.01 Transtional //EN " " http://www.w3.org/TR/html4/loose.dtd" >
不知道大家的感受如何，反正我是看懵逼了，要不是万能的编辑器有自动提示功能，估计我早就放弃前端了。。。
现在文档声明变成了这样：
<!DOCTYPE html>
2、以前，单标签都必须闭合，写成如下模样：
<input/> 、<br/>
现在，单标签不必闭合，可以写成如下模样：
<input> 、<br>
3、背景图引入的时候可以省略引号
如 background : url(1.png) no-repeat ;这里url里面并没有加引号，照样可以完美运行
好了，html5的规范有很多，这里我们就简单举例说明一下就好了，希望大家能够举一反三理解一下；接下来，我们就上手点硬货；
二、新增的结构性标签
<header></header>页眉
<hgroup></hgroup>标题组合
<nav></nav> 导航
<footer></footer>页脚
<section></section>区块
<article></article>文章
<aside></aside>侧边栏
---article之外，section之内，一般表达(推荐文章，热门评论，友情链接，广告位)
---article之内, 一般表达，跟此文章有关系的东西(相关文章，相关任务介绍,引用链接)
以上新标签，都是相对常用的结构元素，在实际应用中用的相对较多，但其实并没有特别突出的作用。主要是增强语义化。当然，更强的语义化，也是html5的一个优势所在。
<figure></figure> 用于对元素进行组合。一般用于图片或视频
<figcaption></figcaption>用于对figure的内容进行说明
�<time></time> 时间
<datalist></datalist>数据列表 ,配合输入框来使用
具体用法见代码：
datalist
效果如下:
有提示的下拉框
<details></details>描述
<summary></summary>对details的简介
<dialog></dialog> 对话框
<address></address>地址
<mark><mark>标记 自带带黄色背景，其他用法和span一样
<keygen></keygen>秘钥（报废了）
<progress></progress>进度条 可以设置 value max min ...
<meter></meter>进度条，用法和上面的差不多
这里特别说一下关于解决html5新标签兼容性问题，特别是针对IE浏览器的方法
想去兼容低版本IE，需要引入html5shiv.js （HTML5_Shiv） -----只能IE识别,兼容h5新标签
用法如下：
<!--[if lt IE 9]>
<script src="html5shiv.js"></script>
<![endif]-->
好了，天色已晚，小编该做梦去了，暂时先分享到这里，后续会接着更新。。
由于本人水平有限，时间仓促，疏漏之处在所难免，望读者包容！
不喜勿喷！
本文为UndefinedCheng原创文章，如想转载，请注明原文网址摘自于http://www.jianshu.com/writer#/notebooks/8901255/notes/8479561，注明出处；
否则，禁止转载；谢谢配合！
网友评论