1

我要发疯了。IE11 拒绝用背景图像填充 DIV 的整个区域，即使我已将 background-size 属性设置为覆盖。考虑以下示例：

CSS：

.bg {
    width: 100%;
    min-height: 220px;
    background: url("bg.jpg") center top no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

HTML：

<div class="bg">bla</div>
<div class="bg">blabla<br />blabla</div>

Chrome、Firefox、Safari、Opera 都符合我的预期：无论浏览器窗口的比例如何，背景图像 bg.jpg 始终覆盖 DIV 的整个可见区域。

另一方面，IE11 没有，而是在 DIV 的左侧和右侧存在可见的间隙（在我的情况下）。当我禁用“背景附件：固定”规则时，它可以工作并且背景图像覆盖整个区域。固定，它没有。悲伤的脸。

这绝对是我正在处理的网站特有的问题，因为我知道 IE11 通常对此没有问题，但我看不到任何会导致此问题的东西。它让我的大脑受伤。我很想发布指向上述网站的链接，但我不能。如果您需要更多示例或有疑问，请随时提出。

非常感谢任何帮助/建议。谢谢！

更新：实际上，当背景附件设置为固定时，IE11 似乎完全忽略了背景大小：封面。叹。

更新 2：一些屏幕截图（希望）在一定程度上说明了问题。在 IE 中，背景似乎是固定的，但没有覆盖它应该覆盖的区域。

FF和IE并排 与指南相同的图像

4

1 回答 1

8

我已经通过应用以下 CSS 设法解决了这个问题。我对它不是 100% 满意，但它必须这样做。

如果有人遇到同样的问题，请测试此修复程序，它可能会根据您的情况起作用，也可能不会。

.bg {
    ...
    background-size: 100% 100%;
}

棍子上的圣蟹鞋……嗯，这有点尴尬。

问题是： IE 被缩小了。

解决方法：放大。

CSS 一直运行良好。

于 2014-03-25T14:07:59.803 回答