我搜索了很长时间，但我无法找到解决问题的方法。
我在音乐标签网站上工作并且设计在.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。所以我也在寻找一个拥有safari mac的人来测试我的网站优化。
感谢您的帮助