H5新增的很多有意思的标签,其中很多标签就是对DIV的细化,赋予了DIV很多意义,但它实际还是相当于DIV,使用这些标签能大大提高代码的可读性,H5也新增了很多媒体标签,用于插入视频、音频等媒体文件。以下HTML5学习笔记原作者
林_Han
,由W3Cschool.cn
编辑整理。
1.<header>
放置页面顶部元素(如菜单栏),块级元素
2.<footer>
放置网页底部信息(如版权、地址等),块级元素
3.<article>
如其名,article
标签就是一个涵盖文章、博客、帖子等内容的容器,块级元素
4.<nav>
放置页面的导航链接,块级元素
5.<figure>
用于文档中插入图片,实现图文混排效果(注意:figure
容器自带margin
值),块级元素
6.<figcaption>
<figure>
的子元素,作为<figure>
的第一个或者最后一个元素,为<figure>
中的图片添加一个可视标题,块级元素
7.<progress>
有意思的一个标签,绘制一个进程条,可设置属性:value
(当前值) max
(最大值),若无value
属性,根据浏览器的不同有可能显示“正在下载...”文本、一个下载的进度条动画,通常与js一起使用,用于动态显示进度
8.<meter>
和progress
标签很像,绘制一个计量条,与progress
不同的是,它表示某种计量,适用于温度、容量等,可设置value max min等属性。另,IE不支持该控件
9.<ruby> <rt> <rp>
ruby
标签用于注释(中文注音或字符),rt
内为注释的内容,rp
内为浏览器不支持ruby
元素时显示的内容
10.<section>
定义文档中的节、区域,和nav
、footer
、header
、article
等标签一样,为语义化的DIV,块级元素H5还新增了很多媒体标签,如source
、video
等,运用蛮简单,可参考W3Cschool