关于Cufon的页面字体渲染

最近自己开发网站，研发字体的时候，发现了有些冲突，经过网上的查找，发现解决办法是使用Cufon。

 

应用场景：在web开发中，设计者所使用的字体，或许浏览器并不支持，从而造成字体（Font Family）冲突。

 

使用：

1、Cufon的核心是使用一个cufon-yui.js

2、引入Cufon的字体文件（例如：微软雅黑、楷体、微软正黑等）

<script type="text/javascript" src="js/cufon/Microsoft_YaHei.font.js"></script>

3、使用基本的替换，例如：

Cufon.replace('h1, h2, h3, h4, h5, h6', { fontFamily: 'Microsoft YaHei', hover: true });

 

 

Cufon目前主要是应用于英文字体，若要对于中文字体在页面中进行渲染，则需要使用而下方法：

1、使用微软雅黑字体，支持中英文。缺点是目前就这一种字体。

2、使用自助形式的中文字体生成。

可以使用：

1)官方网站：http://cufon.shoqolate.com/generate

2)国内的自助生成网站：http://www.cufon-font.com/generate/font_choice.php

 

因为中文字较多，而英文只需要简单的26个字母和数字就可以了，所以中文转化是比较麻烦的。

笔者也是比较建议网站页面需要用到哪些字体，再进行转化，添加到对应的font.js文件中则可。

 

而Cufon的实质：通过指定的文字，配以对应的字体文件，接着生成一张图片，并且隐藏原文字。