uniapp加載字體

加載字體的方法

uni.loadFontFace({
		    family: '中英文都可',
		    source: `url('${host}/static/xxx/xxx.ttf')`,
			success() {
			    console.log('success')
			},
			fail(res) {
			    console.log('fail',res)
			}
		})

 

同一字體的不同粗細

family可設置是同一個，通過設置font-weight決定使用哪個字體文件

uni.loadFontFace({
		    family: '名稱1',
		    source: `url('${host}/static/xxx/xxx.otf')`,
			desc: {
				weight: 'normal'
			},
			success() {
			    console.log('success')
			},
			fail(res) {
			    console.log('fail',res)
			}
		})
		uni.loadFontFace({
		    family: '名稱1',
		    source: `url('${host}/static/xxx/xxx-Roman.otf')`,
			desc: {
				weight: 550
			},
			success() {
			    console.log('success')
			},
			fail(res) {
			    console.log('fail',res)
			}
		})
		uni.loadFontFace({
		    family: '名稱1',
		    source: `url('${host}/static/xxx/xxx-Md.otf')`,
			desc: {
				weight: 650
			},
			success() {
			    console.log('success')
			},
			fail(res) {
			    console.log('fail',res)
			}
		})
		uni.loadFontFace({
		    family: '名稱1',
		    source: `url('${host}/static/xxx/xxx-Bd.otf')`,
			desc: {
				weight: 750
			},
			success() {
			    console.log('success')
			},
			fail(res) {
			    console.log('fail',res)
			}
		})