使用说明:
①可作为网页中的独立区域,如文章中的一小节。
<article>:完整、独立的内容块;里面可包含独立的<header>、<footer>等结构元素。如新闻、博客文章等独立的内容快(不包括评论或者作者简介)。
浏览器最低版本:IE 9、Chrome 5
<aside>:定义周围主内容之外的内容块。如:注解。
浏览器最低版本:IE 9、Chrome 5
<figure>:代表一段独立的内容, 经常与<figcaption>(表示标题)配合使用, 可用于文章中的图片、插图、表格、代码段等等。
浏览器最低版本:IE 9、Chrome 8 <figcaption>:定义 <figure> 元素的标题。
浏览器最低版本:IE 9、Chrome 8
示例图

旧版浏览器支持
IE8以上
浏览器对不认识的元素会当做内联元素展示。而页面相关的语义元素都是块级元素,所以只需设置不支持这些元素的浏览器将它们显示为块级元素即可。
在样式中加入以下代码:
| article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{ display: block; } |
IE8及IE8以下
IE8及IE8以下的浏览器不支持对无法识别的元素应用样式。
所以要通过JS创建这些语义元素,并附加基本的样式。
以header为例
| <script> document.createElement('header'); </script> |
应用外部文件
这些繁琐创建已经有雷锋写好了,只需在旧版的IE上加载就行。
| <!–[if lt IE9]> <script src="//cdn.bootcss.com/html5shiv/r29/html5.min.js"></script> <![endif]–> |









