字体真棒图标在OSX Safari中不起作用 [英] Font Awesome icons not working in OSX Safari

问题描述

我的font-awesome图标在Firefox和Chrome中可以正常工作，但是在Safari中，我只看到其中一些的空白，而其他部分则没有.截图:

My font-awesome icons are working fine in Firefox and Chrome, but in Safari I just see blank space for some of them but not others. Screenshot:

如您所见，在Font Awesome网站上或当我尝试将它们与<i class="fa fa-instagram"></i>一起使用时，fa-twitter，fa-instagram和其他图标都没有显示.

As you can see, the icons for fa-twitter, fa-instagram and others just aren't showing up, either on the Font Awesome website or when I try to use them with <i class="fa fa-instagram"></i>.

真的很奇怪，我已经清除了很多次缓存，无法弄清楚这里可能出什么问题了.

Really bizarre, I've cleared my cache a dozen times and can't figure out what else could be going wrong here.

有什么想法吗?

推荐答案

可能还有另一个问题-我遇到了类似的问题，即自定义生成的图标集(使用Font Custom)将在Chrome，Firefox中显示，以及Safari的某些版本，但没有iOS的版本.我确保没有启用弹出窗口阻止程序，但仍然遇到问题.

There may be another issue at play--I was having a similar issue where a custom-generated icon set (using Font Custom) would display in Chrome, Firefox, and some versions of Safari, but no versions of iOS. I made sure I had no popup blockers enabled, but still was experiencing the issue.

通过一些研究，我发现将此属性添加到图标字体的CSS可以解决此问题:

Through a bit of research, I found that adding this property to the icon font's CSS fixed the issue:

text-rendering: optimizeLegibility;

添加此属性后，在所有浏览器中的渲染都可以正常工作.

After this property was added, rendering in all browsers worked fine.

这篇关于字体真棒图标在OSX Safari中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！