• Page 1 of 1
  • 1
Forum » Wonder Study 寓教于乐 » Wonder Effect js/as/css分享 » Chrome字体锯齿不见了有木有 (使用cufon美化Chrome显示字体。Optimize font display on Chrome by cufon)
Chrome字体锯齿不见了有木有
Seven
Date Th, 2012-10-11, 12:59 | Msg 1
亲们，做个人网站的时候都喜欢用自己喜欢的个性字体有木有

但是自己的个性字体别人没有，在别人机子上看起来惨不忍睹有木有 wacko

使用css的@font-face使个性字体可以有

但是Chrome的字体渲染还是惨不忍睹有木有 angry

现在只好用更BT的方法——cufon

cufon其实便是用Canvas的方式画出好看的字体，专攻Chrome这种即使有字体也惨不忍睹的浏览器（雅黑除外）

使用方法：

去这个站：http://cufon.shoqolate.com/generate/

下载cufon.js介个文件，加载到网页

还是在这个站，选择你的个性字体上传（务必勾上”The EULAs of these fonts allow Web Embedding“和最下面的”I acknowledge and accept these terms“）

其他的直接使用他的设置，英文好的童鞋可以专研一下，比如限定域名下使用之类的设置

设置好了就生成，下载到一个#字体名#font的js有木有，也载入你的网页，比如Wonderland用的是Century Gothic——

<script type="text/javascript" src="Scripts/cufon-yui.js"></script>
<script type="text/javascript" src="Scripts/Century_Gothic.font.js"></script>


最后一步，指定你要渲染字体的标签——

<script type="text/javascript">
Cufon.replace('span');
</script>


如上，便是将所有span标签里的字替换成画出来的效果。

这样便好了，很easy有木有 groupjump

P.S. 由于是画出来的字，所以css中字体阴影神马的属性似乎都会失效，算是个小遗憾吧

TRY IT >
Forum » Wonder Study 寓教于乐 » Wonder Effect js/as/css分享 » Chrome字体锯齿不见了有木有 (使用cufon美化Chrome显示字体。Optimize font display on Chrome by cufon)
  • Page 1 of 1
  • 1
Search: