Question

我知道有很多关于背景图片的问题，但我正在寻找只使用其中一个背景图像的IE7，IE8后备版。与其他人正在寻找的有点不同。

background-color:#ebe2c2;
background-image:url('../images/bg-clouds.png'), url('../images/bg-main-repeat.jpg');
background-repeat:no-repeat, repeat;
background-position:center top, left top;
background-attachment:fixed, fixed;

我怎样才能获得“bg-main-repeat.jpg”及其所有属性？现在IE7 / IE8仅回退颜色。我可以不同地格式化我的代码，以便现代浏览器将应用两个背景图像，但较旧的应用程序仅应用一个我宁愿不添加更多HTML，但如果这是唯一的方法，那么这是唯一的方法。

提前致谢

Answer 1

你会这样做。

background:url('../images/bg-clouds.png') center top no-repeat fixed;
background:url('../images/bg-clouds.png') center top no-repeat fixed,
    url('../images/bg-main-repeat.jpg') left top repeat fixed
;
background-color:#ebe2c2;

Answer 2

我以前使用条件样式表，但使用浏览器特定的html类会更方便，只允许使用一个样式表编写浏览器特定的CSS。

使用以下内容替换您的标准HTML开放标记：

<!--[if IE 7]><html class="lt-ie8 lt-ie9 lt-ie10 ie7"><![endif]-->
<!--[if IE 8]><html class="lt-ie9 lt-ie10 ie8"><![endif]-->
<!--[if IE 9]><html class="lt-ie10 ie9"><![endif]-->                    
<!--[if gt IE 9]><!--><html><!--<![endif]-->

这是你的CSS：

/* default css */
.element {
   background-color:#ebe2c2;
   background-image:url('../images/bg-clouds.png'), url('../images/bg-main-repeat.jpg');
   background-repeat:no-repeat, repeat;
   background-position:center top, left top;
   background-attachment:fixed, fixed;
}

/* conditional css */
.lt-ie9 .element {
   background-color:#ebe2c2;
   background-image:url('../images/bg-main-repeat.jpg');
   background-repeat:repeat;
   background-position:left top;
   background-attachment:fixed;
}

Answer 3

您可以使用以下两种技术之一：

CSS“hacks”强制某些浏览器的行为不同
（好多了）使用内置的Internet Explorer条件语句，例如：
```

```
为在Internet Explorer中呈现的页面指定不同的CSS。

多个背景图像|后退

3 个答案: