有字库是全球第一中文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. [NOI2009] 管道取珠

    sum a[i]*a[i]可以理解为两个独立但同时进行的游戏得到同一个输出序列的方案数. 设f[l,i,j]为每个游戏都已经推出了l个珠子时,第一个游戏里上边儿的管道已经推出了i个,第二个游戏中上边儿 ...

  2. 怎么让Word形状里的文字上下左右居中

    怎么让Word形状里的文字上下左右居中? 第一:左右居中,用段落居中方法: 第二:上下居中,选定图形,单击鼠标右键并选择“设置形状格式”,在选项卡的“文本框”中,选择中部对齐 效果图:

  3. Java核心技术及面试指南 异常部分的面试题归纳以及答案

    4.2.4.1 throw和throws有什么差别?异常(Exception)和错误(Error)有什么差别? throw语句表示抛出异常,由方法体内的语句处理.throws语句用在方法声明后面,表示 ...

  4. Virtual Hosts

    虚拟主机就是一组资源,就是资源的一个逻辑分组 虚拟主机提供对资源的逻辑分组和隔离 虚拟主机有一个名字.当客户端连接到RabbitMQ的时候,客户端指定一个虚拟主机的名字来连接到它.如果认证成功,并且用 ...

  5. mysql 开发基础系列10 存储引擎 InnoDB 介绍

    一. 概述: InnoDB存储引擎提供了具有提交,回滚,和崩溃恢复能力的事务安全,对比MYISAM 的存储引擎,InnoDB写的处理效率差一些并且会占用更多的磁盘空间以保留数据和索引.它的特点有如下: ...

  6. GitHub学习系列之如何删除那些不打算要的项目(图文详解)

    不多说,直接上干货! 1.选择我们要删除的项目: 接下来我们就删除 zlslch下面的这个hello项目.从这个项目的名字中就可以看出来,好像就是为了删除而创建的.点击右上方红框中的Settings. ...

  7. IDEA中MAVEN项目有多个子目录,如何加载构建

    ddts这个项目有三个子目录,每个子目录下面也都有一个 pom.xml       此时需要 右键子目录的 pom.xml,选择Add as Maven Project,在上图中cli.core两个目 ...

  8. java泛型(二)、泛型的内部原理:类型擦除以及类型擦除带来的问题

    微信公众号[程序员江湖] 作者黄小斜,斜杠青年,某985硕士,阿里 Java 研发工程师,于 2018 年秋招拿到 BAT 头条.网易.滴滴等 8 个大厂 offer,目前致力于分享这几年的学习经验. ...

  9. 编写高质量代码改善java程序的151个建议——[1-3]基础?亦是基础

    原创地址:   http://www.cnblogs.com/Alandre/  (泥沙砖瓦浆木匠),需要转载的,保留下! Thanks The reasonable man adapts himse ...

  10. linux sar 命令详解(历史资源查看,如内存、CUP等等)

    sar(System Activity Reporter系统活动情况报告)是目前 Linux 上最为全面的系统性能分析工具之一,可以从多方面对系统的活动进行报告,包括:文件的读写情况.系统调用的使用情 ...