字体真棒图标不在某些浏览器中工作 [英] Font Awesome Icons are not working in some browsers

查看:413
本文介绍了字体真棒图标不在某些浏览器中工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用的是引导+字体真棒,一切是确定与大多数台式机和移动浏览器,但字体真棒图标不与某些浏览器,如Opera移动,Opera Mini的,有些版本的Andr​​oid浏览器的工作。
只显示一个空白的长方形。

I'm using Bootstrap + Font Awesome, and all is ok with most desktop and mobile browsers, but Font awesome icons are not working with some browser like opera Mobile, Opera Mini, and some version of Android Browser. Only displays a blank rectangle.

有谁知道这个问题?并且,有没有解决方案?

Does anyone know that problem? and , Is there a solution ?

感谢


我找不到任何明显的问题,所以我试着用闻所未闻的解决方案。
我试着用两个在线字体转换工具。
首先,我用 http://www.freefontconverter.com/ 原来的FontAwesome SVG转换为TTF。然后我用 http://www.font2web.com/ 到的.ttf转换成.eot,.woof ANF杂项文件。

I couldn't find any apparent problem, so I tried with unheard solutions. I tried with two online font conversion tools. First I used http://www.freefontconverter.com/ to convert the original FontAwesome svg to ttf. Then I used http://www.font2web.com/ to convert that .ttf to .eot, .woof anf .otf.

结果:Opera移动现在会显示正确的图标(我不知道什么是变化,但工程)

Results: opera mobile now displays icons properly. (I don't know whats are the changes, but works)

现在的问题是的黑莓6 。我测试@字体面带BB曲线9300,Modernizr的和谷歌的字体和一切正常。
但FontAwesome仍然无法正常工作...

The problem now is Blackberry 6. I tested @font-face with a BB Curve 9300, Modernizr and Google fonts and all is ok. But FontAwesome still doesn't work...


Opera移动10+支持@字体面,所以这个问题可能是另一个。
我试图用@字体面的另一台服务器的字体和工程确定,但我FontAwesome不能显示的图标正常。

Opera mobile 10+ supports @font-face, so the problem may be another. I tried with another server font with @font-face and works ok, but with FontAwesome I can't show icons properly.


问题不只是我的网站,字体真棒网站的例子和测试工作不...

The problem is not just with my website, Font Awesome website examples and tests are not working...


我试图让使用Modernizr的字体面特征检测回退,但Opera移动和黑莓6个返回true,因为它们支持-feacture。
如何,如果FontAwesome字体加载我能察觉?

推荐答案

有几个不同的问题,我会去了解一下,我希望帮助您解决问题。

There are a couple different issues I would look into that I hope help you fix it.

如果你提什么字体的工作,我们也许可以帮帮忙好。我会比你说的与FontAwesome合作,看到的差异是什么字体。我敢打赌的字形映射到不同的UNI code区,也许是浏览器不从那里读?

If you mention what font worked we could probably help out better. I would compare the font that you said worked with FontAwesome to see what the differences are. I would bet the glyphs are mapped to a different unicode area and maybe the browser doesn't read from there?

您可以使用像字体形成一种工具来检查从其他字体的差异。试图重新生成字体伪造FontAwesome字体我得到验证错误与EM间距时,我注意到和字形有错误(自相交,走错了方向,在缺少极值点)。我在图标字体之前看到这一点,从来没有过一个问题,但我还没有在Opera测试之前,无论是。如果你比较想生成一些作品,你可能会缩小问题下来的字体。

You could use a tool like Font Forge to check differences from other fonts. I noticed when trying to re-generate the FontAwesome font from Font Forge I got validation errors with the em spacing and the glyphs had errors (self-intersecting, wrong direction, missing points at extrema). I've seen this before in icon fonts and never had an issue but I haven't tested on Opera before either. If you compare trying to generate a font with something that works you could probably narrow the issue down.

其他的东西,我敢肯定,你包括在内,但双重检查:

Other Stuff I'm sure you covered but double checking:

我读到这里无需安装字体的本地版本可能与字体嵌入冲突。 <一href=\"https://github.com/FortAwesome/Font-Awesome/issues/247\">https://github.com/FortAwesome/Font-Awesome/issues/247

I read here that having a local version of the font installed might conflict with the font embed. https://github.com/FortAwesome/Font-Awesome/issues/247

如果你拿了图标,字体,然后添加你自己的字形它,然后使用如字体松鼠的东西来产生所有的网络安全形式确保你告诉发电机添​​加字形的UNI code范围内你创建。有一次,我忘了这样做,应用程序只有在A-Z范围内添加的字形。一个简单的检查方法是看gyphs选项卡在演示html页面,并确保所有的图标都包括在内。

If you took the icon-font and then added your own glyphs to it then used something like font squirrel to generate all the web safe formats make sure you told the generator to add the unicode range of the glyphs you created. Once I forgot to do this and the app only added the glyphs in the a-z range. An easy way to check is to look at the gyphs tab in the demo html page and make sure all the icons are included.

您正在使用正确的CSS3字体面的规则和嵌入EOT,TTF,WOFF和SVG,你已经等了一点点。我对一些老的iPhone注意到字体需要永远显示。

You're using the proper CSS3 font-face rule and embedding eot, ttf, woff, and svg and you've waited a little bit. I noticed on some old iphones the font takes forever to display.

使用类似Modernizr的字体面功能的工具,检测可能使某些浏览器之间轻松一点的支持。

Using a tool like modernizr font-face feature detect might make some of the support between browsers a little easier.

我很好奇,想看看是什么问题。

I'm curious to see what the issue is.

这篇关于字体真棒图标不在某些浏览器中工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆