当我在背景属性中使用SVG时,如下所示：
.svg-button {
-webkit-transform: scale(3.0) // root of the problem!
background: url(Button.svg) no-repeat;
width: 32px;
height: 32px;
}
结果我得到模糊的图像.同时这个风格的标签文字很清楚.另外,如果我通过使用CTRL(浏览器缩放)缩放页面,而不是转换属性一切都很清楚.
如果我替换CSS背景属性：
<object type="image/svg+xml" data="Button.svg" width="32" height="32"></object>
在任何情况下,图像都以任何尺度清晰.
哪里有问题？
样品在jsfiddle
更新：
我找到了关于这个问题的更多信息：
> StackOverflow question
> Bug ticket for Chrome(我试过我的测试在Safari / Chrome / IE9 / 10和行为是一样的.
