iT邦幫忙

1

判斷何種瀏覽器後使用不同的CSS檔案

您好
我想在網頁上先判斷何種瀏覽器(EX: IE FIREFOX...)後,再呼叫不同的CSS,
ex: IE 使用IE.css , FIREFOX使用 FIREFOX.css
我是用 if(navigator.userAgent.indexOf("MSIE")>0) 來判斷 ,
請問如何呼叫 CSS檔案?
請問JQuery 如何判斷何種瀏覽器及呼叫 CSS檔案?
謝謝!

6
wordsmith
iT邦高手 1 級 ‧ 2010-04-22 14:45:29
最佳解答

一般而言,IE和其他瀏覽器在CSS的呈現上比較不一樣,因此只要針對IE去做css的設定就好了。

針對IE CSS的寫法,雖然各種css hack可以參考,不過最好的做法還是用條件式的CSS,例如

<pre class="c" name="code">    <!--[if lt IE 8]>
     <link rel="stylesheet" href="ie.css" type="text/css" media="screen, projection" />
    <![endif]-->

上面的寫法,IE 8以下的瀏覽器就會去讀這個CSS,其他的瀏覽器和IE 8就不會。

條件式的寫法有很多,這裡有篇文章整理很多資訊,可以參考一下。

利用JavaScript或是jQuery去判別瀏覽器,再讀入不同版本CSS,除非有什麼特殊的應用方式,不然好像有點殺雞用牛刀的感覺。

hahahacja iT邦新手 5 級 ‧ 2010-04-24 22:07:46 檢舉

您好
我是用一純CSS來做選單,當A:hover時會換底圖,在IE ok , 在FIREFOX不ok ,
想直接判斷瀏覽器來直接使用指定的css
您能教我用JavaScript或是jQuery 判別瀏覽器,再讀入不同版本CSS?
謝謝!

<pre class="c" name="code"><link rel="stylesheet" type="text/css" href="../css/css_oth.css" />
    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="../css/css_ie.css" />
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="../css/css_all.css" />
6
海綿寶寶
iT邦超人 1 級 ‧ 2010-04-21 22:57:17

參考看看
MozTW

6
edenfwu
iT邦新手 5 級 ‧ 2010-04-22 18:44:11

判斷瀏覽器的方法(javascript)
var isIE = navigator.userAgent.search("MSIE") > -1;
var isIE7 = navigator.userAgent.search("MSIE 7") > -1;
var isIE8 = navigator.userAgent.search("MSIE 8") > -1;
var isFirefox = navigator.userAgent.search("Firefox") > -1;
var isOpera = navigator.userAgent.search("Opera") > -1;
var isSafari = navigator.userAgent.search("Safari") > -1;//Google瀏覽器是用這核心
if (isIE) {
//是IE

}
.......

我要發表回答

立即登入回答