2

background-size が IE7 と IE8 でサポートされていないことは知っています。以下のように AlphaImageLoader を使用する解決策があることも知っています。

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='image.gif', sizingMethod='scale');

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
             src='image.gif', sizingMethod='scale')";

しかし、残念ながらそれは機能していません。助言がありますか？

CSSでの私のコードは次のとおりです。

.useBGImage { 
    background-image: url('../img/BGImage.gif'); 
    background-size: 400px 50px; 
    background-repeat: no-repeat;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
            src='../img/BGImage.gif', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(
                 src='../img/BGImage.gif', sizingMethod='scale')";
}

画像の元のサイズは 400px * 70px です。

4

2 に答える 2

1

私の提案は、これを解決するために利用可能なポリフィル ライブラリの 1 つを使用することです。

法案に合うと私が考えることができる2つがあります：

これらのうち、CSS3Pie は単なる よりも多くの機能をカバーしているため、グラデーションなどにbackground-sizeも同様のスタイルを使用している場合に適していますfilter。もう 1 つは、この特定の機能のためだけのワントリック ポリフィルです。

filterどちらもうまく機能することが知られているので、好きな方を選んで、それらの醜いスタイルを捨ててください。

于 2015-10-24T20:31:00.617 に答える
0

マイクロソフト独自のドキュメントによるとsizingMethod='scale'

スケール
          イメージを拡大または縮小して、オブジェクトの境界を埋めます。

お分かりのように、 scaleは実際には "スケーリング" するわけではないため、使用する単語の選択としては適切ではありません。これは、コンテナーの境界に合わせて画像を拡大または縮小するだけです。

画像を比例的に効果的にスケーリングするには、HTML マークアップで画像の高さと幅を削除することをお勧めします。

次に、これをCSSとして使用します...

.useBGImage {
    background-image: url('../img/BGImage.gif');  
    background-repeat: no-repeat;
    width: auto; /* required for IE8 */
    max-width: 100%;
    height: auto;
}
于 2015-10-23T03:57:53.160 に答える