有字库是全球第一中文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. VueJs(14)---理解Vuex

    理解Vuex 一.Vuex 是什么? 首先我们来分析一种实际开发中用vue.js的场景,你有n个组件,当你改变一个组件数据的时候需要同时改变其它n个组件的数据,那么我想你可能会对 vue 组件之间的通 ...

  2. (转载)java内存模型

    java并发采用的是共享内存模型,线程之间的通信对程序员来说是透明的,内存可见性问题很容易困扰着java程序员,今天我们就来揭开java内存模型的神秘面纱. 在揭开面纱之前,我们需要认识几个基础概念: ...

  3. JavaEE 要懂的小事:二、图解 Cookie(小甜饼)

    Writer      :BYSocket(泥沙砖瓦浆木匠) 微         博:BYSocket 豆         瓣:BYSocket FaceBook:BYSocket Twitter   ...

  4. 了解Java内存模型,看完这一篇就够了

    前言(此文草稿是年前写的,但由于杂事甚多一直未完善好.清明假无事,便收收尾发布了) 年关将近,个人工作学习怠惰了不少.两年前刚做开发的时候,信心满满想看看一个人通过自己的努力,最终能达到一个什么样的高 ...

  5. Spring Boot 系列(六)web开发-Spring Boot 热部署

    Spring Boot 热部署 实际开发中,修改某个页面数据或逻辑功能都需要重启应用.这无形中降低了开发效率,所以使用热部署是十分必要的. 什么是热部署? 应用启动后会把编译好的Class文件加载的虚 ...

  6. 绝对路径的表示方式为什么是"/usr"而不是"//usr"

    今天闲逛贴吧,竟然看到有个人问绝对路径的表示方式为什么不是//usr/local而是/usr/local.原文: 我想99%的人都没想过这个问题,都理所当然的认为:它不就是根"/" ...

  7. [转]MySQL-死锁查询

    本文转自:https://blog.csdn.net/qq105319914/article/details/50562783 1.查询是否锁表 show OPEN TABLES where In_u ...

  8. C#.NET和C++结构体Socket通信与数据转换

    最近在用C#做一个项目的时候,Socket发送消息的时候遇到了服务端需要接收C++结构体的二进制数据流,这个时候就需要用C#仿照C++的结 构体做出一个结构来,然后将其转换成二进制流进行发送,之后将响 ...

  9. 【Java每日一题】20170118

    20170117问题解析请点击今日问题下方的“[Java每日一题]20170118”查看(问题解析在公众号首发,公众号ID:weknow619) package Jan2017; import jav ...

  10. 【JDK和Open JDK】平常使用的JDK和Open JDK有什么区别

    注意到这个问题,是在CentOS7上安装JDK的时候,查找相关的资料,发现安装JDK之前都需要检查或卸载系统上原生的Open JDK,这才引起了注意. 到了这里,引用查到的一篇说明. 转自:http: ...