对众多的网页设计者来说，Firefox和IE 之间存在的兼容性一直是让大家无比困扰的问题。尤其是IE7.0发布以后， 修正了IE6的部分问题，不但没有解决一直困扰大家的问题， 反而增加了我们的负担， 既要调试IE6和Firefox，还需要调试IE7.0，大大增加了我们的工作负担。

在IE7发布之前，由于IE无法识别CSS中的!important属性，所以许多网页设计者都是通过这个方式来进行IE和Firefox的微调， 然而新发布的IE修正了这个Bug， 所以目前IE7浏览器也可以正常的识别!important这个属性了。 那么我们如何为这三个不同的浏览器来定义CSS样式呢？下面是最为常见的一种方法。

首先新建样式表test.css 并写入下列CSS样式

#test /*Firefox 可以正常识别*/
{
width:auto;
margin:0 auto;
height:200px;
background:#FF0000;
}

*html #test /* IE浏览器 可以正常识别*/
{
width:auto;
margin:0 auto;
height:200px;
background:#CCCCCC;   /* IE 7 IE6，IE5 将会调用这项属性*/
}

注意， 如果大家不添加第二段代码的话，那么IE和Firefox都将调用第一段CSS样式，但是一旦加入第二段CSS代码， 那么IE浏览器就会忽略第一段代码，直接调用 *html #test 里面的属性值。在第二段代码中，我们不能够直接使用!important 属性来使IE6和IE7调用不同的CSS属性。比如下面这段代码：

*html #test
{
width:auto;
margin:0 auto;
height:200px;
background:#CCCCCC!important; /*这段代码并不能区别IE6和IE的区别 */
background:#CCCCCC;