IE6, IE7 & IE8 不能识别HTML5元素，所以当你在CSS选择器里运用了HTML5元素，例如aside,header等，就会引起一个很大的问题。

举个列子：

在我的项目中我的头部是这么写的

     
   
      
       
Standardista
     
       
CSS3, JavaScript and HTML5 explained
   
      
     

接下来我想为<header>里面的h1、h2添加样式，在Chrome, Firefox, Safari and Opera这些支持HTML5元素的浏览器里面，我们可以很

轻易的写出如下代码：

header {   position:relative;}hgroup {   float: right;   width: 650px;   -moz-transform:rotate(-5deg);   -webkit-transform:rotate(-5deg);   -o-transform::rotate(-5deg);   transform:rotate(-5deg);}hgroup h1 {   letter-spacing: 5px;}hgroup h1 a {   color: #ffffff;   text-shadow: 4px 4px 4px rgba(0,0,0, 0.4);   font-size:60px;}hgroup h2 {   color:#ffffff;   text-transform:uppercase;   text-shadow: 1px 1px 1px rgba(0,0,0, 0.3);   font-size:116%;}

但是，郁闷的是IE6、7、8不能识别我们的元素，不能支持字体阴影、不能支持rgba颜色等等。

我们又不能抛弃IE，IE在浏览器的占有率大家都懂的。。。。

那怎么办呢？没事，那我们就借用JS帮助IE来创建HTML5元素

代码如下：

代码说明：

1.在非IE的浏览器，这些代码是不可见的、

2.用一个匿名函数创建了一个HTML5元素的列表，我把它当作一个数组分离的字符串，比创建一个引用元素的数组要更加快捷，方便。

IE6、7、8虽然不能添加阴影，但是至少可以添加width of the <hgroup>, the font sizes, colors等