背景图像放大firefox

Question

当我正在处理该项目时，我遇到了在操作系统窗口下扩展firefox的问题。如果你将浏览器页面的比例改为100％高达90％（例如），切断背景图像，问题只出现在firefox中，只有在windows或ubuntu中才能正常工作。可能有人面对，并会建议你如何解决这个错误。

示例：http://jsfiddle.net/uL53nd7z/1/

div {
    background-image: url(http://oi60.tinypic.com/jal5wh.jpg);
    background-repeat: no-repeat;
    height: 23px;
    width: 23px;
}

Answer 1

您可以使用background-size: cover为您的身高和宽度添加相对单位，以便您的图片获取div的所有内容。根据您的目标受众，您可以使用em或rem，以便他们“关注”页面的修改。

我的代码：

html {
    font-size: 12px;
}

div {
    background-image: url(http://oi60.tinypic.com/jal5wh.jpg);
    background-repeat: no-repeat;
    height: 1.916666666666667rem; /*23/12*/
    width: 1.916666666666667rem;
    -webkit-background-size: cover;
    background-size: cover;
}

结果jsFiddle