如何爲IE設置特殊的CSS？

我想爲ie8使用一些不同的CSS，但只保留一個CSS文件。任何人都可以告訴我最好的「黑客」是什麼？是的，我知道黑客不好，但我想保留一個CSS文件，至少現在。如何爲IE設置特殊的CSS？

例如，在非IE8瀏覽器，我想在瀏覽器中看到這一點：

div.content_header_heading { 
    background: -moz-linear-gradient(top, #cccccc 0%, #eeeeee 35%, #eeeeee 65%, #cccccc 100%); /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cccccc), color-stop(35%,#eeeeee), color-stop(65%,#eeeeee), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, #cccccc 0%,#eeeeee 35%,#eeeeee 65%,#cccccc 100%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, #cccccc 0%,#eeeeee 35%,#eeeeee 65%,#cccccc 100%); /* Opera11.10+ */ 
    background: -ms-linear-gradient(top, #cccccc 0%,#eeeeee 35%,#eeeeee 65%,#cccccc 100%); /* IE10+ */ 
}

但是，如果瀏覽器是IE8，我想在瀏覽器中看到這一點：

div.content_header_heading { 
}

來源

2011-05-18 Maricel

可能的重複[如何寫一個IE條件註釋一次針對所有IE版本？]（http://stackoverflow.com/questions/1774574/how-to-write-one-ie-conditional-comment-所有即ie版本一次） – 2011-05-18 11:25:27

Paul Irish對此問題有很好的解決方案。它涉及到使用條件註釋放在<html>標籤類：

<!--[if lt IE 7 ]> <html class="ie6"><![endif]--> 
<!--[if IE 7 ]> <html class="ie7"><![endif]--> 
<!--[if IE 8 ]> <html class="ie8"><![endif]--> 
<!--[if IE 9 ]> <html class="ie9"><![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> <html class=""> <!--<![endif]-->

然後你可以針對IE版本的CSS規則：

.ie8 div.content_header_heading { 
}

見http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/。

來源

2011-05-18 11:24:57

+1：這真的是一個不錯的CSS解決方案！ – 2011-05-18 11:27:39

這看起來非常好。任何人都知道如何將這種用一個else組合成一個： < - [如果（LT IE 9）]><！HTML類= 「ielt9」> < - [如果（GT IE 9）|！（IE）]><！ - BTW這是什麼代碼？我不熟悉這種方式使用代碼。 – Maricel 2011-05-18 11:37:00

我想補充一點，您可以使用不是類，而是整個CSS文件僅用於特定的IE。想法是一樣的，但你不會凌亂你的普通CSS文件。 [看看這裏]（http://css-tricks.com/how-to-create-an-ie-only-stylesheet/） – enoyhs 2011-05-18 11:37:01

我遇到的最好方法是使用Internet Explorer的不同CSS文件。

然後在您的HTML中，您可以使用您在Internet上找到的典型條件代碼塊排除或包含它們。

 
<!--[if IE 6]> 
    CSS HERE 
<![endif]-->

只能放在那些需要與IE版本不同的CSS中。

來源

2011-05-18 11:26:46

，以確保每一個HTML元素被解釋（所有）瀏覽器的最好方法是使用http://www.modernizr.com/

如果你想使用頁眉，頁腳或其他新的HTML5元素的Modernizr將創造他們讓老瀏覽器瞭解這些元素。

來源

2011-05-18 11:36:04 Gustav

對IE瀏覽器的不同版本，最簡單的CSS黑客是：

.color {color: #777;} /* for all browsers */ 
* html .color {color: #C39;} /* for IE6 */ 
*+html .color {color: #66F;} /* for IE7 (you can also use the long expresion " *:first-child+html ") */ 
.color {color: #0FC\0/;} /* for IE8, going last */

以上所有的都是黑客，但至少他們使用有效的CSS，除了黑客的IE8在這裏我推薦使用條件註釋。

來源

2011-05-18 11:58:17 inadcod

如何爲IE設置特殊的CSS？

回答

相關問題