Question

我有一个Sharepoint网站，我想更改徽标。我想左边有一张照片，右边有一张照片。所以我在网站的资产中创建并上传了一个doublelogo.css文件，其中包含以下内容：

.s4-title {
    background: url(PIC1.jpg), url(PIC2.jpg);
    background-color:#FFCC00;

    background-position: left, right;

    background-repeat: no-repeat;

    min-height:99px
}

之后我添加了对我网站的<HEAD>部分（v4.master文件）的引用，该引用为：

<link rel="stylesheet" href="/siteassets/doublelogo.css" media="screen" />

使用Chrome打开我的网站，它按预期工作。即使我通过放大和缩小浏览器窗口来测试图片，图片也是左右稳定的。行

但问题是每当我用ie8或ie9打开网站时。

我读到有关于将一个div放入另一个div的解决方法，但我需要帮助，因为我真的不了解该过程。

有人可以帮助我吗？

（我实际上想要有两个徽标，因为当我有一个徽标，并且更改了我的计算机的分辨率时，徽标会增加或减少，这是我不想要的。）

Answer 1

您是否尝试background-image而不是background：

background-image: url(PIC1.jpg), url(PIC2.jpg);

如果你想支持IE8，你可以解决这个有两个额外的div，IE9应该支持两个背景图像URL。

查看this list上的caniuse.com，了解多种背景的浏览器支持。

修改

我创建了一个嵌套div的示例：

http://jsfiddle.net/aUMnC

我使用background-color并且div的大小不同只是为了向您展示，而您只需使用background-image代替。

Answer 2

这样做：例如：

div.test {
    background-image: url(../pix/logo_quirksmode.gif), url(../pix/logo_quirksmode_inverted.gif);
    background-repeat: repeat-y;
    background-position: top left, top right;
    width: 385px;
    height: 100px;
    border: 1px solid #000000;
}

在一个元素中的两个背景图像，但IE没有显示它

2 个答案: