background-size：覆盖webkit中的bug

Question

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

jsFiddle：http://jsfiddle.net/um4cQ/（如果您看不到左侧或顶部的红色背景，请尝试调整结果区域的大小。）

我已经看到网络上的一些错误引用some dating back to 2011，但我还没有听到开发人员的任何消息。更重要的是暂时，如果有一个CSS解决方法（不使用javascript）。

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

Answer 1

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

因此，您的图像的宽高比在这里有所作为，我认为这是因为background-size: cover;试图不通过弄乱纵横比来扭曲图像。

Here's my fiddle working ...只需修改您的图片，使其具有适合其容器的宽高比。