有字库是全球第一中文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();
}

还需要要使用中对再摸索,欢迎交流!网上也没有更多的资料分享!

有字库API方法使用一二的更多相关文章

  1. Xcode itunes完美打包api方法

    转:http://bbs.csdn.net/topics/390948190 Xcode6 itunes完美打包api 方法! 特点轻盈小巧,方便快捷!

  2. 深入学习Tesseract-ocr识别中文并训练字库的方法

    上篇文章简单的学习了tesseract-ocr识别图片中的英文(链接地址如下:https://www.cnblogs.com/wj-1314/p/9428909.html),看起来效果还不错,所以这篇 ...

  3. 外部调用mvc的api方法时,如何解决跨域请求问题?

    首先,创建一个mvc项目(包含webapi),我们模拟一个场景 1)在项目的Controller 创建一个WeiXinApiController public class WeiXinApiContr ...

  4. Xcode6 itunes完美打包api 方法

    转:http://bbs.csdn.net/topics/390948190 Xcode6 itunes完美打包api 方法! 特点轻盈小巧,方便快捷!

  5. Atitit. 衡量项目规模 ----包含的类的数量 .net java类库包含多少类 多少个api方法??

    Atitit. 衡量项目规模 ----包含的类的数量 .net java类库包含多少类 多少个api方法?? 1 framework 4.5 (10万个api)1 2 Jdk8   57M1 3 Gi ...

  6. Java中的API方法总结

    API方法总结 File file = new File(path); #创建文件对象,指向一个目录 file.exists() #判断目录或者文件是否存在 File[] files = file.l ...

  7. C#MVC通过AJAX调用API方法进行上传下载

    //这是写的一个类,具体是上传图片的上传和下载 public class FileResult    {        public int Code { get; set; }        pub ...

  8. 【ASP.NET Core】MVC模型绑定——实现同一个API方法兼容JSON和Form-data输入

    在上一篇文章中,老周给大伙伴们大致说了下 MVC 下的模型绑定,今天咱们进行一下细化,先聊聊模型绑定中涉及到的一些组件对象. ------------------------------------- ...

  9. js常用API方法

    String对象常用的API:API指应用程序编程接口,实际上就是一些提前预设好的方法. charAt() 方法可返回指定位置的字符. stringObject.charAt(index) index ...

随机推荐

  1. Intellij IDEA神器居然还有这些小技巧

    概述 Intellij IDEA真是越用越觉得它强大,它总是在我们写代码的时候,不时给我们来个小惊喜.出于对Intellij IDEA的喜爱,我决定写一个与其相关的专栏或者系列,把一些好用的Intel ...

  2. 安全测试之sql注入

    不管是web界面还是app,都会涉及表单输入和提交,如果程序员没有对提交的字符进行过滤或者特殊处理,很容易会产生问题,这里讲的的sql注入就是其中一种方式,在表单中输入sql语句达到进入系统的目的. ...

  3. sessionStorage 基本使用

    sessionStorage 是浏览器数据存储的方法之一,用于临时保存同一窗口的数据,关闭窗口后sessionStorage 的数据将会不存在,它是以 key value 键值对的形式储存. 基本用法 ...

  4. 我可能不懂Array.prototype.sort

    今天 fix 我们后台系统的一些 bug.系统是基于 beego 和模板开发的,各种前后端代码揉作一团,没有格式,没有 eslint,全局变量满天飞,连 js 代码都有后端的插值,读起来非常 酸爽. ...

  5. 微信小程序 WXS实现json数据需要做过滤转义(filter)

    前言 最近有在做小程序开发,在开发的过程中碰到一点小问题,描述一下先. 本人在职的公司对于后台获取的 json 数据需要做过滤转义的很多,不同的状态码会对应不同的文字,但是在微信小程序中又没有类似 v ...

  6. .NET西安社区 [拥抱开源,又见 .NET] 活动简报

    拥抱开源, 又见 .NET」 随着 .NET Core的发布和开源,.NET又重新回到了人们的视野.除了开源.跨平台.高性能以及优秀的语言特性,越来越多的第三方开源库也出现在了Github上——包括M ...

  7. 爬虫实现:根据IP地址反查域名

    域名解析与IP地址 域名解析是把域名指向网站空间IP,让人们通过注册的域名可以方便地访问到网站的一种服务:IP地址是网络上标识站点的数字地址,为了方便记忆,采用域名来代替IP地址标识站点地址.域名解析 ...

  8. 翻译wiki(一):Bios boot partition

    文章翻译自wiki,水平有限,若有错万请见谅.原文:https://en.wikipedia.org/wiki/BIOS_boot_partition BIOS boot partition是一个分区 ...

  9. Linux核心命令

    Linux核心命令 strace(查看系统调用的一个过程) 例:strace cat /test.txt netstat perf top pidstat mpstat dstat vmstat sl ...

  10. [转]【Angular4】基础(六):HTTP模块

    本文转自:https://blog.csdn.net/u013451157/article/details/79519719 版权声明:本文为博主原创文章,未经博主允许不得转载. https://bl ...