load-font-face.md 1.4 KB
Newer Older
D
DCloud_LXH 已提交
1 2 3 4
## uni.loadFontFace(options) @loadfontface

<!-- UTSAPIJSON.loadFontFace.description -->

D
DCloud_LXH 已提交
5 6
<!-- UTSAPIJSON.loadFontFace.compatibility -->

D
DCloud_LXH 已提交
7 8
<!-- UTSAPIJSON.loadFontFace.param -->

DCloud_iOS_XHY's avatar
DCloud_iOS_XHY 已提交
9 10 11
#### source 格式说明
source 属性指定自定义字体路径时,必须使用`url()`包裹,支持本地文件路径、远程地址,app 端 4.33 版本开始支持 base64 格式数据;

D
DCloud_LXH 已提交
12 13 14
<!-- UTSAPIJSON.loadFontFace.returnValue -->

#### 注意事项
DCloud_iOS_XHY's avatar
DCloud_iOS_XHY 已提交
15 16
- app-ios 平台加载字体一定是全局生效,不支持通过global属性设置为非全局生效
- source 属性指定自定义字体路径时,必须使用`url()`包裹。可能某些平台不包裹也可以生效,但标准规范是包裹,按标准写法才能全端生效。如下:
W
wanganxp 已提交
17 18 19 20 21 22 23 24 25 26 27 28 29 30 31
```uts
uni.loadFontFace({
  global: true,
  family: 'UniFontFamily',
  source: "url('/static/font/uni.ttf')", //需使用url方法包裹。本地字体请放在/static目录下,否则打包时不会把字体文件打进去。也支持网络字体
  success() {
    console.log('global loadFontFace uni.ttf success')
  },
  fail(error) {
    console.warn('global loadFontFace uni.ttf fail', error.errMsg)
  },
})
```

不同平台支持的字体格式不同,另见[css字体](../css/font-family.md)
DCloud-yyl's avatar
DCloud-yyl 已提交
32

D
DCloud_LXH 已提交
33 34 35 36 37 38
<!-- UTSAPIJSON.loadFontFace.example -->

<!-- UTSAPIJSON.loadFontFace.tutorial -->

<!-- UTSAPIJSON.general_type.name -->

DCloud-yyl's avatar
DCloud-yyl 已提交
39
<!-- UTSAPIJSON.general_type.param -->