第一種，是CSS HACK的方法
height:20px; /*For Firefox*/
*height:25px; /*For IE7 & IE6*/
_height:20px; /*For IE6*/
注意順序。
這樣也屬於CSS HACK，不過沒有上面這樣簡潔。
#example { color: #333; } /* Moz */
* html #example { color: #666; } /* IE6 */
*+html #example { color: #999; } /* IE7 */
第二種是使用IE專用的條件注釋
<!-- 其他瀏覽器 -->
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<!-- 適合於IE7 -->
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
<!--[if lte IE 6]>
<!-- 適合於IE6及一下 -->
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
第三種css filter的辦法，以下為經典從國外網站翻譯過來的。
建立一個css樣式如下：
#item {
width: 200px;
height: 200px;
background: red;
}
建立一個div,並使用前面定義的css的樣式：
<div id="item">some text here</div>
在body表現這裡加入lang屬性,中文為zh：
<body lang="en">
現在對div元素再定義一個樣式：
*:lang(en) #item{
background:green !important;
}
這樣做是為了用!important覆蓋原來的css樣式,由於:lang選取器ie7.0並不支援,所以對這句話不會有任何作用,於是也達到了ie6.0下同樣的效果,但是很不幸地的是,safari同樣不支援此屬性,所以需要加入以下css樣式：
#item:empty {
background: green !important
}
:empty選取器為css3的規範,儘管safari並不支援此規範,但是還是會選擇此元素,不管是否此元素存在,現在綠色會現在在除ie各版本以外的瀏覽器上。
對IE6和FF的相容可以考慮以前的!important
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
