Firefox 无法识别字体

     2023-03-06     140

关键词:

【中文标题】Firefox 无法识别字体【英文标题】:Firefox not recognizing a font 【发布时间】:2012-08-06 08:44:17 【问题描述】:

我正在通过 CSS 设置 pre HTML 元素的样式,如下所示:

pre 
    font-family : "Franklin Gothic Medium","Arial Narrow Bold","Arial",sans-serif;

它在 Chrome/Chromium、Opera、Safari 和 IE 中有效(意味着该字体确实安装在计算机中),但在 Firefox 中无效。 Firefox 只识别Arial

而且我尝试过使用其他自定义字体(如Century Gothic)并且它可以工作,因此它能够识别自定义字体。

底线,Firefox 无法识别 Franklin Gothic MediumArial Narrow Bold,即使

它们安装在计算机中 它能够识别其他自定义字体

这里可能发生了什么?

【问题讨论】:

这是 mozilla 的问题:bugzilla.mozilla.org/show_bug.cgi?id=644385 【参考方案1】:

如果找不到解决方案,请使用 CSS3 字体路线。 http://www.w3schools.com/css/css3_fonts.asp

【讨论】:

【参考方案2】:

解决方案并不简单。字体外观因浏览器、操作系统以及客户端系统上可用的字体而异。如果没有根据您的目标受众进行进一步测试,请不要轻信这个答案。

在 Windows 上,从 Firefox 4 和 IE9 开始,字体是使用 DirectWrite 而不是 GDI 呈现的。自此更改以来,“Arial Narrow”和“Arial Black”等字体被视为 Arial 系列的一部分,而不是独立的系列。因此,在 Firefox 中,您可以通过带有一些修饰符的常规 Arial 声明来访问 Arial Narrow。 IE9 以类似的方式工作,但似乎嵌入了一些实用技巧,使其以开发人员习惯的方式工作。

富兰克林哥特式媒体

font-family: "Franklin Gothic Medium", "Franklin Gothic", sans-serif;

除 Firefox 之外的所有浏览器都理解“Franklin Gothic Medium”。 Firefox 没有并继续选择下一个选择“Franklin Gothic”,您甚至可能认为自己没有,但这就是“Franklin Gothic Medium”在 DirectWrite 世界中的存在。 在没有任何其他修饰符的情况下(斜体、粗体、拉伸),当指定“Franklin Gothic”时,我的 Firefox 会抓取“Franklin Gothic Medium”。

Arial 窄粗体

font-family: "Arial Narrow Bold", "Arial Narrow", "Arial", sans-serif;
font-stretch: condensed;
font-weight: 700;

某些浏览器,例如 Chrome 和 IE7-8 可以识别“Arial Narrow Bold”。但是 IE9 和 Firefox 没有。 IE9 确实识别“Arial Narrow”。 Firefox 落入 Arial。 font-stretch: condensed 告诉 Firefox 使用 Arial 的“Arial Narrow”版本,font-weight: 700; 告诉 IE9 和 Firefox 使用“Arial Narrow Bold”版本据我所知。 600、700、800 和 900 的字体粗细对我来说触发了粗体。

带有 Arial Narrow Bold 后备的 Franklin Gothic Medium

现在您有了 Catch-22。

font-family: "Franklin Gothic Medium", "Franklin Gothic", "Arial Narrow Bold", "Arial Narrow", "Arial", sans-serif;

如果 Firefox 可以找到“Franklin Gothic”,那你很好,但如果不能,那么它会退回到“Arial”。如果使用font-stretch: condensed; font-weight: 700; 将其变为“Arial Narrow Bold”,则在不使用 Arial 后备时会影响 Franklin 的外观。如果 Franklin 可用,每个浏览器都会将 font-weight 规则应用于 Franklin——这根本不是你想要的。如果你使用font-stretch: condensed 并且 Firefox 可以访问 Franklin,它会尽职尽责地压缩它。 (我在任何其他浏览器中都没有看到。)在您的特定情况下,我会指望 Firefox 获得 Franklin 并接受将常规 Arial 用作后备。但是添加“Franklin Gothic”(适用于 FF)和“Arial Narrow”(适用于 IE9)会有很大帮助。

(在撰写本文时,Chrome 的版本为 21,Firefox 的版本为 14。)

【讨论】:

非常感谢您的回答@David。我很高兴我不必花费整个星期天(父亲节)来解决这个问题。 font-stretch: condensed 为我解决了问题,并选择了字体的窄变体,即 BC 39 3/1 Narrow 没有被 FF 渲染,而 IE 和 Chrome 则完全没有问题。

Firefox 无法识别 WebP MIME 类型

】Firefox无法识别WebPMIME类型【英文标题】:WebPMIMEtypenotrecognizedinFirefox【发布时间】:2016-09-2611:20:11【问题描述】:世界准备好迎接新的图像格式WebP了吗?我正在考虑使用它,规格看起来很性感,但是,Firefox似乎不支持它(谁知... 查看详情

字体无法在 Firefox 中加载,但可以在 chrome 中使用

】字体无法在Firefox中加载,但可以在chrome中使用【英文标题】:Fontdoesnotloadinfirefoxbutworksinchrome【发布时间】:2012-06-2315:01:55【问题描述】:字体有问题,不确定为什么要为Chrome加载,但在Firefox中似乎没有加载。这是example提前... 查看详情

Firefox 网络字体未加载

】Firefox网络字体未加载【英文标题】:Firefoxwebfontsnotloading【发布时间】:2011-09-2609:07:01【问题描述】:我只在Firefox中遇到了webfonts的问题,所有其他浏览器(包括IE)都可以正常工作。我的问题是webfonts根本无法加载。我查看了... 查看详情

在Firefox上使用字体[重复]

】在Firefox上使用字体[重复]【英文标题】:Usingfont-faceonfirefox[duplicate]【发布时间】:2014-02-0821:54:40【问题描述】:看了很多教程,很多网站,还是没有找到解决办法...我正在为我的网站使用自定义字体...我尝试的最后一件事是Pa... 查看详情

Android 无法识别不同的语言字体

】Android无法识别不同的语言字体【英文标题】:AndroidnotabletorecognizedifferentlanguageFonts【发布时间】:2016-08-2116:21:48【问题描述】:制作了一个应用程序来将不同的单词翻译成不同的语言使用Yandex转换器在浏览器上获得正确的结果... 查看详情

IE 和 Firefox 中的 Lato 字体缺少字母

】IE和Firefox中的Lato字体缺少字母【英文标题】:LatofontmissinglettersinIEandFirefox【发布时间】:2014-10-1513:04:22【问题描述】:WTF正在使用LatoGoogleHosted(不确定字体)字体???在IE8上,字体看起来很乱,缺少字母和缺少单词空格,... 查看详情

自定义字体在 Firefox 中不起作用。

】自定义字体在Firefox中不起作用。【英文标题】:CustomfontisnotworkinginFirefox.【发布时间】:2014-07-2210:33:50【问题描述】:我已经搜索了它的解决方案,并且我认为,我正在按照建议做所有事情,但它仍然无法正常工作。自定义字... 查看详情

Visual Studio 2015 无法识别 OTF 转换字体 (UWP)

】VisualStudio2015无法识别OTF转换字体(UWP)【英文标题】:VisualStudio2015doesnotrecognizeOTFconvertedfonts(UWP)【发布时间】:2015-11-1400:19:28【问题描述】:我正在开发我的WP8Silverlight应用程序的通用版本,因此我创建了一个新的通用Windows项目... 查看详情

从输入类型日期中删除“X”(清除按钮)并更改 Firefox 中的字体系列

】从输入类型日期中删除“X”(清除按钮)并更改Firefox中的字体系列【英文标题】:Removethe\'X\'(clearbutton)fromtheinputtypedateandchangethefontfamilyinFirefox【发布时间】:2018-05-0205:47:25【问题描述】:我的表单中有一个输入类型字段,但... 查看详情

如何专门针对 Firefox 浏览器? [复制]

】如何专门针对Firefox浏览器?[复制]【英文标题】:HowtotargetFirefoxbrowserspecifically?[duplicate]【发布时间】:2017-04-2108:13:08【问题描述】:我的字体在Firefox上无法正确呈现某些字符。如果检测到Firefox,我想将字体更改为其他字体。... 查看详情

Firefox 无法加载@font-face? [复制]

】Firefox无法加载@font-face?[复制]【英文标题】:Firefoxcannotload@font-face?[duplicate]【发布时间】:2012-02-0419:03:53【问题描述】:可能重复:@font-facefontsonlyworkontheirowndomain我一直在处理我的博客模板,我正在使用@font-face,但字体似乎... 查看详情

无法理解 Firefox 错误:SyntaxError: missing after property list

】无法理解Firefox错误:SyntaxError:missingafterpropertylist【英文标题】:TroubleunderstandingFirefoxerror:SyntaxError:missingafterpropertylist无法理解Firefox错误:SyntaxError:missingafterpropertylist【发布时间】:2014-05-2920:51:29【问题描述】:我有以下脚本... 查看详情

Amazon S3 CORS(跨域资源共享)和 Firefox 跨域字体加载

】AmazonS3CORS(跨域资源共享)和Firefox跨域字体加载【英文标题】:AmazonS3CORS(Cross-OriginResourceSharing)andFirefoxcross-domainfontloading【发布时间】:2012-08-2703:03:32【问题描述】:长期以来,Firefox无法从与当前网页不同的来源加载字体,... 查看详情

Firefox 中的@fontface 问题[关闭]

】Firefox中的@fontface问题[关闭]【英文标题】:@fontfaceissuesinFirefox[closed]【发布时间】:2014-07-2013:47:45【问题描述】:您好,我正在为一个客户开发一个网站,并且我在Firefox上玩得很开心。@fontface字体之一加载正常(TheHandRegular)... 查看详情

Zip Mime 类型似乎无法识别

...是当我开始处理zip文件时,我的浏览器无法识别它是zip。Firefox和IE都在我的测试机器上运行提示,询问用什么程序打开文件。Explorer被设置为zip文件关联的默认 查看详情

itextpdf文件打印中文无法识别问题

参考技术A  经常用ITEXT生成一些PDF文件,最近发现生成的PDF文件如果不在WINDOWS系统打印会出现中文字体打印不出来,例如手机端(包括一些PDF查看工具),查了一些资料是字体库的问题。  ITEXT程序中创建字体... 查看详情

获取 wkhtmltopdf 识别用户字体文件夹

...fc-list”列出字体时,字体就会出现。问题仍然是wkhtmltopdf无法识别它们。 查看详情

Titanium mobileweb 字体无法正常工作

...ndroid、ios、移动web上运行良好。但是如果您在浏览器(即firefox)上打开该文件,字体将无法正常工作。有换 查看详情