我一直在阅读关于@ font-face规则并试图找出它是否值得在一个项目中使用它来为标题渲染"franklin gothic medium"而不是像sIfr这样的东西.我认为对于不支持它的浏览器,我可以让它回归到Arial上.
问题是,我无法得到关于哪种浏览器支持以这种方式嵌入字体的明确答案.
到目前为止,我已经解决了IE的问题,但不支持.ttf文件.其他浏览器我不确定.
如果有人能指出我的兼容性图表的一些kinf将是伟大的.
乔恩
本文讨论了关于中途的浏览器支持.这里是最相关的一点,尽管整个事情值得一读:
CSS3(甚至1997年和1998年的CSS2草案)早已承诺使用@ font-face规则进行字体嵌入的标准化方法.许多人可能不知道的是,Opera 9.5已经支持这个规则,为Mac,Windows和iPhone OS提供Safari版本,并且承诺用于Firefox 3.1.以及IE6及更高版本.
可悲的是,虽然支持@ font-face暗示了Opera 9.5和Firefox 3.1(请参阅我在下面的#4中的评论),但实际情况并非如此.
虽然有一个问题.IE以外的所有浏览器都支持链接到TrueType字体文件.Microsoft仅支持专有的EOT文件格式.
编辑:包括此更新由里克东京的回答.
[更新2] Opera 10和Firefox 3.1现在支持在当前发货的alpha或beta中链接到TrueType和OpenType(但不支持EOT).
Safari 3.1(和Webkit Nightly版本),Firefox 3.1和Opera 10支持.ttf(TrueType字体)和.otf(OpenType字体)的@ font-face嵌入.Internet Explorer版本5+仅支持.eot(专有嵌入式开放格式)的@ font-face嵌入.
微软制作了一个名为WEFT(仅限Windows)的可怕小字体转换工具,可用于将大多数字体格式转换为.eot.
CSS3.info有一个关于如何使用@ font-face规则的简短教程.该网站是玩CSS3技巧(或在这种情况下CSS2提出的技巧)的一个很好的资源.
在A List Apart上有一篇关于这个主题的更全面的文章.
确保您在网页中嵌入的任何字体都表明可以在其许可证中执行此操作,因为该字体将存储在公共目录中的Web服务器上,任何人都可以免费下载.许可证并不总是明确涵盖此用途,但您通常可以直接联系设计人员询问.只要您包含指向其网页的链接,它们通常会让您使用字体.我不确定Franklin Gothic Medium是否被批准用于此用途,但我怀疑它是否正确.
这里有一些免费字体的资源.如果你做了足够的挖掘,你通常可以找到适合你的类似面孔:
雷拉拉比
迪特斯特芬
乔斯布文加