css - 背景大小 : cover bug in webkit

Question

在我看来，webkit 中有一个错误，可能是舍入问题，导致 background-size 属性在设置为 时无法覆盖元素的整个区域覆盖。

jsFiddle:http://jsfiddle.net/um4cQ/ (如果您没有在左侧或顶部看到红色背景，请尝试调整结果区域的大小)。

我在网络上看到了一些关于该错误的引用，some dating back to 2011 ，但我还没有收到开发人员的任何消息。目前更重要的是，如果有 CSS 解决方法(不使用 javascript)。

有没有人为此找到可行的解决方法？

Answer 1

我添加了供应商前缀并修复了一些图像，然后我将 background: 颜色和无重复的速记规则分组。这修复了一些图像，但不是全部，所以我注意到它与您拥有的图像尺寸有关，我对所有图像使用了相同的图像(有效)并且它有效。

所以图像的纵横比在这里有一定的关系，我认为这是因为 background-size: cover; 试图不通过弄乱纵横比来扭曲图像。

Here's my fiddle working ...只需修改您的图像，使它们的宽高比能够正确适合其容器。