2012-01-13 7 views
1

私はtarjetインターネットエクスプローラのハックを9より低くするか、より具体的にする必要があります。私は負荷代替画像にしたい...私はこれらのブラウザのためにグラデーションや画像を使用していますインラインハックCSSはIE9に下がっていますか? (またはCSS3対応でないブラウザすべて)

_prop:val -> ie6 
*prop:val -> ie6 & ie7 
????????? -> ie8 & ie7 & ie8 

私は非CSS3対応ブラウザをtarjetするインライン CSSハックが必要ですが、IE8はそれをサポートしていません。

条件COMENTSを使用するか、またはJavaScriptを使用して外部スタイルシートを使用することを示唆の回答を避けてください必要な場合のみ。私は、このコードは無効になることを知っているが、そのわずかに1つの小さなこと。プラス私はかどうかを知るために好奇心その):)

+1

IE8は、これはその後、動作していない勾配 –

+0

をサポートしています。背景画像:-ms-の直線勾配(下、RGB(221221221)を20%、rgb(255,255,255)68%); –

+0

これはrgb(...、...、...)で動作しますが、255,255,255は白ですので、色の16進値を取得して、それを単に私の応答スクリプトに挿入することはできません! –

答えて

1

ブラウザはCSS3のすべてをサポートします。

代わりに、単にこのように、古いブラウザのフォールバックのプロパティを指定します。

#selector { 
    background: url("gradient.png"); 
    background: gradient(...); 
} 
+0

これは多くの場合IE9をターゲットにしています。背景情報については http://paulirish.com/2009/browser-specific-css-hacks/をご覧ください。 –

+0

私はそれがIE9をターゲットとしていませんでしたが、別のセレクタでは、何がnth-childに関係するのかを覚えていません。IE9と* IE8とは一致します... – danwellman

4

私はプロジェクトでIE8でグラデーションを使用しています。それは動作します!私の知る限りでは、国境半径ため

.shadow { 
    zoom: 1; 
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=0, Strength=3) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=45, Strength=2) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=90, Strength=3) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=135, Strength=2) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=180, Strength=3) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=225, Strength=2) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=260, Strength=3) 
    progid:DXImageTransform.Microsoft.Shadow(color='#999999', Direction=305, Strength=2); 
    -moz-box-shadow: 0 0 5px #222; /*Mozilla-basierte Browser (z.B. Firefox)*/ 
    -webkit-box-shadow: 0 0 5px #222; /*WebKit-basierte Browser (z.B. Safari/Chrome)*/ 
    box-shadow: 0 0 5px #222; /*CSS3 Standard*/ 
} 

IE9までのサポートがない:ボックスシャドウの

<style> 
     #gradient { 
      color: #fff; 
      height: 100px; 
      padding: 10px; 
      /* For WebKit (Safari, Google Chrome etc) */ 
      background: -webkit-gradient(linear, left top, left bottom, from(#00f), to(#fff)); 
      /* For Mozilla/Gecko (Firefox etc) */ 
      background: -moz-linear-gradient(top, #00f, #fff); 
      /* For Internet Explorer 5.5 - 7 */ 
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF); 
      /* For Internet Explorer 8 */ 
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF0000FF, endColorstr=#FFFFFFFF)"; 
     } 
    </style> 

は、このような回避策があるように思われます。私はいくつかのjQueryプラグインを使用してIEでborder-radiusを実現しています。このコードがあなたを助けたと願っています!任意の値の末尾に直接\ 9を置く

prop: val\9 

だけでIE8を対象とし、

+0

ボーダー半径とボックスシャドウに似たようなものがありますか? –

+0

私は自分の質問を更新しました。 box-shadowはい、複雑で境界線半径はie9までです。しかし、私はjQuery経由でボーダー半径の効果を達成するためにプラグインを使用しています! –

+0

ねえ!ありがとうございますが、それはつまり、テキストシャドウであるようですhttp://jsfiddle.net/YcPDA/ –

4

の下にあなたがハックを必要としない、なし現在以降:あなたはこれを使用する必要が

+0

はい、ロードして、私はそれを防止したいと思った。私はむしろ私の現在の状況では、より遅いコードよりも無効なコードを生成する –

+0

?CSSプロパティは、何かがロードされる前に評価されます。 [あなた自身をチェックする]ことができます(http://phihag.de/2012/so/gradient-dl.html):最新のブラウザにグラデーションファイルを読み込まないでください。 – phihag

+0

それは使用されないかもしれませんが、画像はすべてのブラウザにロードされます –

関連する問題