css - 使用背景大小调整背景图像的大小，在 Firefox 中失败

Question

我的链接前有一个图标，我将此图像设置为我的 a-tags 的背景:

a {
    background: url('../../images-1/pil.png') left center no-repeat;
    background-size: 8px auto; // This is the real width of the image
}

在某些地方我想要更小的图标，并且我想使用以下方法调整背景图片的大小:

a.small {
    background-size: 5px auto;
}

在 Firefox(和 IE9)中，这会导致图像被裁剪，即使它变小了。在 Chrome 和 Safari 中，它按预期工作。这是 Firefox 中的错误吗？我该如何解决这个问题？ FF版本为28.0。

Answer 1

我认为你应该使用它来提高兼容性

a.small {
    background-size         : 5px auto;
    -webkit-background-size : 5px auto;
    -moz-background-size    : 5px auto;
    -o-background-size      : 5px auto;
}