删除.svg图像上的浏览器消除锯齿功能

Question

有没有办法阻止Chrome和Firefox对.svg图像应用消除锯齿？如果图像按比例放大或缩小，或保持其原始尺寸无关紧要，则始终会发生。这适用于大图像，但对于小图标，抗锯齿非常明显，使图像看起来模糊。

我尝试过各种不同的image-rendering css属性值。我相信图像渲染：清晰的边缘是我需要的，但这还没有得到适当的支持而且没有效果。

上面形状的边缘应该是直黑色，没有抗锯齿。

Answer 1

添加shape-rendering =＆＃34; crispEdges＆＃34;形状。你也可以通过CSS来做到这一点。

* {
  shape-rendering: crispEdges;
}