视网膜显示设备的 CSS 规则应用于 ie 8

Question

您好，我正在使用一个模板，并且有一个为视网膜显示设备编写的 css 规则。问题是它也适用于 IE8。我在网上搜索过，规则写得正确，我无法弄清楚这里出了什么问题。任何 hekp 表示赞赏。

代码如下:

@media (min–moz-device-pixel-ratio: 1.5),
(-o-min-device-pixel-ratio: 3/2),
(-webkit-min-device-pixel-ratio: 1.5),
(min-device-pixel-ratio: 1.5),
(min-resolution: 1.5dppx) {
/* on retina, use image that’s scaled by 2 */
.fader:before {
background: url(../mobapp/iphone@2x.png) 0 0;
}

覆盖了以下内容:

.fader:before {
        background: url(../mobapp/iphone.png) 0 0; 
        background-size: 100%;
        left: -40px;
        width: 593px;
        height: 782px;
        top: 0px;
    }

Answer 1

@media (min–moz-device-pixel-ratio: 1.5),
(-o-min-device-pixel-ratio: 3/2),
(-webkit-min-device-pixel-ratio: 1.5),
(min-device-pixel-ratio: 1.5),
(min-resolution: 1.5dppx) {
     /* on retina, use image that’s scaled by 2 */
     .fader:before {
      background: url(../mobapp/iphone@2x.png) 0 0;
}

// Pads and larger phones
@media only screen and (min-width: 600px)
{
    .fader:before {
        background: url(../mobapp/iphone.png) 0 0; 
        background-size: 100%;
        left: -40px;
        width: 593px;
        height: 782px;
        top: 0px;
    }
}

maybe