最近自己开发网站,研发字体的时候,发现了有些冲突,经过网上的查找,发现解决办法是使用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的实质:通过指定的文字,配以对应的字体文件,接着生成一张图片,并且隐藏原文字。
希望更多人把时间花在生活、陪家人和女朋友身上,而不是敲代码上.
分享到:
相关推荐
Cufon 是一个用来替代 sIFR 框架,作为一种基于 JavaScript 的网页字体引入方案, Cufon 的核心功能是通过一个名为“cufon-yui.js” 的 JavaScript 类库,提供给开发人员的。在web开发中,经常面对的一种“冲突”,...
这是Cufon版的微软雅黑字体,含2500个常用简体中文字符。可以直接用于网站设计
cufon是现在解决网站字体的较好开源项目。小弟收集了一些资源,拿出来分享一下。这种开源东西还好意思要积分?免费!
前端项目-cufon,用画布和VML快速替换文本-不需要闪存或图像。
凉亭 Cufon 的凉亭包
Cufon 阿拉伯语文本转换器 用法: Cufon . replace ( 'h2' , { onBeforeReplace : ArabicStyle . convert } ) ;
蓝色圆角按钮个人博客模板基于arial.js和cufon-yui.js插件制作,DIV+CSS布局设计,全套模板,包含首页、技术支持、关于我们、博客、联系我们等网站模板页面。
简单的静态网页制作 <!-- header --> <p> ... <td width="120" height="30"><strong>主 页 </a></strong>| <td width="120" height="30">...<script type="text/javascript"> Cufon.now(); </html>
$(function() { var $mybook = $('#mybook'); var $bttn_next = $('#next_page_button'); var $bttn_prev = $('#prev_page_button');... //Cufon.refresh(); } }).attr('src',source); }); });