背景图像css无法显示在IE7& 8 [英] Background-image css fails to display in IE7 & 8

问题描述

由于某些原因，我有问题在IE 7和IE8显示背景图片。在IE9和更多的现代浏览器中，它的工作原理和输出如下：

For some reason I'm having issues displaying a background image in IE 7 and IE8. In IE9 and more modern browsers it works and outputs the following:

（CSS生成登录周围的灰色边框元素）

(The CSS produces the grey bordered elements around the Login)

IE7和IE8我得到的是以下：

However in IE7 and IE8 all I get is the following:

我不记得这个问题与其他网站，我做交叉兼容，但我再次尝试，避免使用图片现在节省页面加载

I cannot remember having this issue with other sites that I made cross-compatible but then again I try and avoid using images nowadays to save on page load times.

我的CSS如下：

#contentright .panel {
   background-image: url("/incl/images/bg_panel200.gif");
   background-repeat: no-repeat;
}


#contentright .panelbottom {
background-image: url("/incl/images/bg_panelbottom200.gif");
background-position: center top;
background-repeat: no-repeat;
}

我做了一个快速的Google搜索和一些以前的Stack Overflow答案建议修改CSS的格式如下：

I did a quick Google search and some previous Stack Overflow answers have suggested amending the CSS to the the following format:

 background: url('/incl/images/bg_panelbottom200.gif') no-repeat center top;

但是这似乎也不起作用。

However this doesn't appear to work either.

提前感谢。

推荐答案

由于这是我第一个响应式设计，我不得不使用媒体查询css基于屏幕/视口大小。看起来只有media ='screen'和media ='print'声明工作在IE7和IE8意味着我的声明：将不工作这是我的背景图像不显示的原因，因为IE7和8不明白这个声明，因此忽略它。感谢其他有效的答案家伙，但他们是我已经知道并试过的东西。

As this is my first responsive design, I have had to use media queries to adapt the css based upon the screen/viewport size. It appears that only the "media="'screen'" and "media='print'" declarations work in IE7 and IE8 meaning my declaration of : will not work. This is the reason my background-images are not displaying because IE7 and 8 do not understand this declaration and therefore ignore it. Thanks for the other valid answers guys but they are things I already knew about and had tried.

这篇关于背景图像css无法显示在IE7& 8的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！