uni-app: 使用自定义字体文件(hbuilderx 3.6.18)

标签：自定义 18 app 字体 https 组件 uni font com

一，复制字体文件到static目录下,如图: 

说明：刘宏缔的架构森林是一个专注架构的博客，地址：https://www.cnblogs.com/architectforest

         对应的源码可以访问这里获取： https://github.com/liuhongdi/
         或: https://gitee.com/liuhongdi

说明：作者:刘宏缔 邮箱: [email protected]

二，在App.vue的css中定义字体文件的信息

代码:

    @font-face {
            font-family: my-font;
            src: url('~@/static/fonts/FZKTJW.TTF');
    }

三，使用字体的代码:

<template>
    <view>
        <view class="intro">本项目已包含uni ui组件，无需import和注册，可直接使用。在代码区键入字母u，即可通过代码助手列出所有可用组件。
光标置于组件名称处按F1，即可查看组件文档。</view>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                
            }
        },
        methods: {
            
        }
    }
</script>
 
<style>
.intro {
    font-size: 35rpx;
    font-family: my-font;
}
</style>

四，测试效果:

未指定字体时：使用的是默认字体 指定字体后:可以看到字体已生效

五，查看hbuilderx的版本: 

 

 

 

标签：自定义,18,app,字体,https,组件,uni,font,com
From： https://www.cnblogs.com/architectforest/p/17114793.html