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;
        }

}