Safari中的SVG图标模糊 [英] SVG icons in safari are blurred

问题描述

我注意到，通过'img'标签放置的svg图标在safari中无法正确呈现.他们最终变得模糊不清.我创建了一个简单的html页面，并使用不同的方法多次粘贴了相同的svg图标:

I have noticed that svg icons that placed via 'img' tag aren't rendered correctly in safari. They end up being all blurry. I have created a simple html page and pasted the same svg icon multiple time using different methods :

我有点沮丧，为什么'img'标签会降低图标的质量?

I am a bit frustrated why does the 'img' tag lower the quality of the icon?

提前谢谢！

我创建了演示

推荐答案

很抱歉，可能要晚了，但我遇到了类似的问题，这是因为模糊滤镜，当我将阴影放在另一个元素上并保留了原来的一个，它工作正常.例如，您必须复制图标元素，对其施加阴影，最后将其放置在实际图标下方.

I'm sorry it's probably late but I had a similar problem and it was because of the blur filter, when I put the shadow on another element and kept the original one on top of it, it worked fine. E.g., you have to duplicate your icon element, apply shadow to it and finally place it below the actual icon.

这篇关于Safari中的SVG图标模糊的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！