1

Retina 画像の読み込みに問題があります。私は2つの画像を持っています。1 つの正常および 1 つの網膜。問題は、網膜画像を縮小する方法がわからないことです。サイズが 2 倍になりました。これは私のcssです。

.home {
    background: url('../images/buttonSprite.png') -49px -52px;
    width: 43px;
    height: 43px;
}
@media all and (-webkit-min-device-pixel-ratio: 2) {
    .home {
        background: url('../images/buttonSprite@2x.png') no-repeat -79px -113px !important;
        -webkit-background-size:43px 43px;
    }
}

この問題を解決するには？

4

1 に答える 1

2

これだけを試してください：

.home {
    background: url('http://img580.imageshack.us/img580/9284/buttonsprite.png') no-repeat -49px -53px;
    width: 43px;
    height: 43px;
}

@media all and (-webkit-min-device-pixel-ratio: 1.5), all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (min-device-pixel-ratio: 1.5) {
    .home {
        background: url('http://img90.imageshack.us/img90/5624/buttonsprite2x.png') no-repeat -39px -56px;
        background-size: 200px 496px;
    }
}

1.5 のピクセル比を使用したことに注意してください。これはほぼ標準です。他のプレフィックスも含めました。

于 2013-01-30T19:02:04.790 に答える