评论

小程序加载外部字体

加载外部字体

有两种方法,步骤1、2、4是相同的。


1.将下载下来的字体文件上传到文件服务器上,拿到url

2.将url的域名在小程序公众平台配置downloadFile合法域名

------------------------------------

第一种方法:

3.在app.js中加载字体

wx.loadFontFace({
  family: 'Bitstream Vera Serif Bold',
  source: 'url("https://sungd.github.io/Pacifico.ttf")',
  success: console.log
})

第二种方法:

3.在app.css中加载字体文件

@font-face {
    font-family: 'Bitstream Vera Serif Bold';
    src: url('https://sungd.github.io/Pacifico.ttf');
}

——————————————————————————

4.如需全局配置,在app.css中配置全局样式,font-family填字体的英文名称。不用全局的话,page里的font-family可不配置,在页面需要显示的字体上用font-family设置

page {
    font-family: "Bitstream Vera Serif Bold";
    background-color: #34C758;
    color: #fff;

}


最后一次编辑于  2021-01-08  
点赞 0
收藏
评论

1 个评论

  • allenyu
    allenyu
    2022-10-20

    是不是ttf所在的域名要有跨域头才行?

    2022-10-20
    赞同
    回复
登录 后发表内容