CSS媒体正文背景图像不可见

Question

我正在维护一个网上商店http://www.binkfournituren.nl。样式表包含几行响应行为的代码。

响应行为的部分变化是页脚背​​景图像。图像设置在 body 标签上，最初全屏打开网站时如下所示：

body{
   margin:0;
   padding:0;
   color:#444;
   font-family:"Georgia",Verdana,Arial,Helvetica,sans-serif;
   min-height:100%;
   background:url(../image/footer-bg-400-Green.png) left bottom repeat-x
}

在平板电脑/手机或较小的浏览器窗口上查看页面时，应在 body 元素上设置不同的图像。例如，这应该使用以下 css 代码来完成：

@media only screen and (max-width: 960px)
body {
    background: url(../image/footer-bg-900-Green.png) left bottom repeat-x;
}

当我使用 chrome 浏览器检查 body 元素时，图像似乎可用。我可以将鼠标悬停在 css 图像链接上并实际看到图像。直接链接也可以：http://www.binkfournituren.nl/catalog/view/theme/shoppest/image/footer-bg-900-Green.png

这在我们迁移到 VPS 环境之前一直有效。文件属性指示对文件夹的读取和写入访问权限。当前行为可以在以下浏览器中重现：

• 火狐
• 铬
• IE 9/10/11
• 野生动物园
• iPad 迷你
• Android 设备

IE 8 是否显示背景图片？

您对为什么在调整视口大小时背景图像不可见有什么建议吗？

Answer 1

IE8 不支持媒体查询。所以这被浏览器忽略了：

@media only screen and (max-width: 960px)
body {
    background: url(../image/footer-bg-900-Green.png) left bottom repeat-x;
}