有字库是全球第一中文web font(在线字体)服务平台,官网写的有点牛X
需要注册帐号才可以使用,免费字体有限制,一页字数不可以超过500 个,超过500个字体就不会为标签添加字体样式,比较坑爹!
我在尝试使用两种方法之后,把一些心得拿来分享
- 只能加载一种字体
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<!--只有一种字体,需要加载这个js-->
<script type="text/javascript" src="http://cdn.webfont.youziku.com/wwwroot/js/wf/youziku.client.min.js"></script>
$(function(){ onlyOneFont(); }); //只返回一种字体 function onlyOneFont(){ var getUrl = 'http://service.youziku.com/webFont/getFontFace'; var entity = { url:getUrl, AccessKey:'69c8434454f842f28b46712f1b080c4a', //这个Key,可以根据不同的key返回不同的字体名称,但是在使用到页面上时,只显示 ‘思源简体’一种效果,不知道哪里的问题 Content:'测试5555', Tag:'.only-font' }; $youzikuClient.getFontFace(entity,function(data){ console.log('获取到的字体为:' + data.FontFamily); var fontFamily = data.FontFamily; $('.only-font').css({ 'font-family':fontFamily, 'font-size':'24', 'color':'#555', 'margin-top':'50px', 'margin-left':'100px' }); }) }
- 卢教模式(可以同时为不同的标签设置字体)
//需要加载两个js文件 <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js" type="text/javascript" charset="utf-8"></script> <!--卢教模式--> <script type="text/javascript" src="http://cdn.webfont.youziku.com/wwwroot/js/wf/youziku.api.min.js"></script> <script type="text/javascript" src="https://cdn.webfont.youziku.com/wwwroot/js/wf/youziku.lib.min.js"></script>
//可以同时设置多个字体 function luJiaoMode(){ $youziku.load(".test", "69c8434454f842f28b46712f1b080c4a", "winmantun23001"); $youziku.load(".text2","13e841f53229490490392b9a9c90ea6e", "hdjxyt"); $youziku.draw(); }
还需要要使用中对再摸索,欢迎交流!网上也没有更多的资料分享!