css - 仅媒体屏幕不加载新背景

Question

我有一个网站，我使用 div 作为背景（因为我需要将其正确居中，所以反对将它放在正文中）这是该网站，http://asystec.hailstormcommerce.com/

这是CSS：

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
.backgroundwrapper {
background-image: url('images/asystec-mobile-bg.jpg');
background-position:center 188px;
        }

}

.backgroundwrapper {
background: #fff url('images/pageBgOld.jpg')  no-repeat;
background-position:center 188px;
height:1903px;
width:1903px;

}

我试过清除浏览器上的缓存，但它肯定会加载 pageBgOld 图像而不是新图像。任何帮助都会很棒。

Answer 1

在您的主要风格之后编写媒体查询。像这样写：

.backgroundwrapper {
background: #fff url('images/pageBgOld.jpg')  no-repeat;
background-position:center 188px;
height:1903px;
width:1903px;

}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
.backgroundwrapper {
background-image: url('images/asystec-mobile-bg.jpg');
background-position:center 188px;
        }

}