我如何在CSS中使用自定义字体

时间:2011-04-09 18:05:21

标签: css browser fonts

为了使用浏览器不支持的自定义字体,我可以尝试哪些选项?

5 个答案:

答案 0 :(得分:6)

更新:截至2015年,最好的选择是使用CSS3 font-face,它几乎无处不在。谷歌字体平台上有很好的例子。

正确的知道可能最好的选择是cufon:http://cufon.shoqolate.com/generate/

它是一个JavaScript库,可以将服务器上的字体文件转换为浏览器中这些字体的JavaScript表示形式。适用于所有主流浏览器,看起来非常好,不会减速(比较旧的基于闪存的sIFR解决方案),但确实需要JavaScript。 (没有它你仍会看到所有的文字,但标准字体)。

或者您可以使用CSS3 font-face:http://randsco.com/index.php/2009/07/04/p680 你基本上把你的字体放在服务器上,然后用CSS来渲染它们,简单明了。所有浏览器都支持它,但现在它可能是你最好的镜头。不需要JavaScript。 (我知道我说cufon是你最好的镜头,但是那两个同样好,他们只是用一些不同的方式来做)

更新:此外,font-face可能更好的另一个原因是与其一起使用的文本变得与文档中的任何其他文本一样。在大多数浏览器中,Cufoned文本变为canvas标签,并且存在例如文本选择的问题。此外,如果您在任何大量文本上使用cufon(如整篇文章的文本,而不仅仅是标题),它可能会变得非常慢(因为JavaScript必须渲染大量文本在这种情况下)。标题很好。

答案 1 :(得分:4)

我会推荐Google网络字体。它易于使用,所有字体都是免费的。您只需选择一种字体并获取添加到代码中的脚本标记。就这么简单。

http://www.google.com/webfonts

答案 2 :(得分:1)

我不认为这可以通过css使用 Cufon 来实现这一点。通过将其替换为图片,您可以文本 /标题转换为字体。搜索机器人仍然可以正确索引它。 ( SEO友好

http://cufon.shoqolate.com/generate/

https://github.com/sorccu/cufon/wiki/

答案 3 :(得分:1)

你可以使用Typekit来实现,这是一个很酷的基于JavaScript订阅的解决方案,允许你使用庞大的自定义字体库。

请查看:

http://typekit.com/

很好吃!

安迪

答案 4 :(得分:0)

您还可以使用fontsquirrel中的generate,它会生成一个包含不同格式字体的zip文件,因此您可以将它们与@ font-face css属性一起使用。适用于多种浏览器,包括IE。

http://www.fontsquirrel.com/fontface/generator