我已经搜索了很长时间，但找不到解决问题的方法。
我在一个音乐标签网站上工作，设计中有一些图标.svg和.jpg，问题是在 Mac 上的 Safari 上，有些images/icons是像素化的，不能正确显示。
我已经尝试过 CSS 属性，例如：
image-rendering: -webkit-optimize-contrast; // Safari 6, UC Browser 9.9
image-rendering: -webkit-crisp-edges; // Safari 7+
image-rendering: -moz-crisp-edges; // Firefox 3.6+
image-rendering: -o-crisp-edges; // Opera 12
image-rendering: crisp-edges; // Chrome 41+ and Opera 26+
[...]
shape-rendering: geometricPrecision;
这些工作中的任何一个都会使图像在其他导航上的渲染更加糟糕。
所以我正在寻找解决方案...
我已经尝试粘贴整个<svg>，但它并没有改变任何东西..
<svg width="32" height="32" style="margin-right:5px;vertical-align:middle;padding-bottom:4px;" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.1" x="0px" y="0px" viewBox="0 0 100 100"><g transform="translate(0,-952.36218)"><path style="color:#000000;enable-background:accumulate;" d="m 50,964.36218 c -20.98681,0 -38,17.01333 -38,38.00002 0,20.9867 17.01319,38 38,38 20.98681,0 38,-17.0133 38,-38 0,-20.98669 -17.01319,-38.00002 -38,-38.00002 z m -11,20 30,18.00002 -30,18 z" fill="#000000" stroke="none" marker="none" visibility="visible" display="inline" overflow="visible"></path></g></svg>
经过一番搜索，我明白这image-rendering: crisp-edges;意味着图像将专注于速度而不是质量，所以我改为optimizeQuality但我无法测试它，因为我没有 Mac。所以我也在寻找有 Mac 和 safari 的人来测试我的网站优化。
感谢帮助