SVG渲染问题

在为较旧的Android版本中的默认Android浏览器（4.1，也许4.2/4.3 [这是一个客户的Android设备上，我不能完全肯定，他使用的是哪个版本]）SVG精灵无法正确显示。而不是显示一个具有正确大小正确的剪裁，浏览器显示图像的缩小版，显示整个精灵，像下面的截图（Android浏览器4.1）：SVG渲染问题

的Android截图（假渲染）

它应该是这样的：

的Android截图（正确渲染）

下面是精灵的CSS：

.sprite { 
    display: inline-block; 
    background-image: url('img/sprite.svg'); 
    background-repeat: no-repeat; 
    background-size: 1000px 1000px; 
    overflow: hidden; 
    color: transparent !important; 
} 

.sprite.logo { 
    width: 270px; 
    height: 55px; 
    background-position: 0 0; 
    display: block; 
} 

[...]

其他浏览器（包括Android浏览器4.4）示出正确的一切。

来源

2014-12-04 Simon Jentsch

直到Android 4.4（以及部分支持的效果/过滤器）才完全支持SVG：http://caniuse.com/#search=svg – 2014-12-04 16:11:44