html5新增标签理解

H5新增的很多有意思的标签，其中很多标签就是对DIV的细化，赋予了DIV很多意义，但它实际还是相当于DIV，使用这些标签能大大提高代码的可读性，H5也新增了很多媒体标签，用于插入视频、音频等媒体文件。

1.

放置页面顶部元素（如菜单栏），块级元素

---

2.

放置网页底部信息（如版权、地址等），块级元素

---

3.

如其名，article标签就是一个涵盖文章、博客、帖子等内容的容器，块级元素

---

4.

放置页面的导航链接，块级元素

---

5.

用于文档中插入图片，实现图文混排效果（注意：figure容器自带margin值），块级元素

---

6.

的子元素，作为

的第一个或者最后一个元素，为

中的图片添加一个可视标题，块级元素

---

7.

有意思的一个标签，绘制一个进程条，可设置属性：value（当前值） max（最大值），若无value属性，根据浏览器的不同有可能显示“正在下载...”文本、一个下载的进度条动画，通常与js一起使用，用于动态显示进度

---

8.

和progress标签很像，绘制一个计量条，与progress不同的是，它表示某种计量，适用于温度、容量等，可设置value max min等属性。

另，IE不支持该控件

---

9.

ruby标签用于注释（中文注音或字符），rt内为注释的内容，rp内为浏览器不支持ruby元素时显示的内容

---

10.

定义文档中的节、区域，和nav、footer、header、article等标签一样，为语义化的DIV，块级元素

---

---

---

---

---

H5还新增了很多媒体标签，如source、video等，运用蛮简单，可参考W3school

另，编辑器好难用！