uniapp中H5项目引入阿里巴巴的中体字体没效果,字体文件均为4kb - 5kb

分类：uni-app

字体 uniapp

在APP.VUE中

<script>  
    export default {  
        onLaunch: function() {  
            console.log('App Launch')  
        },  
        onShow: function() {  
            console.log('App Show')  
        },  
        onHide: function() {  
            console.log('App Hide')  
        }  
    }  
</script>  

<style>  
    /*每个页面公共css */  
    @font-face {  
        font-family: "webfont";  
        font-display: swap;  
        src: url('./static/webfont.eot');  
        /* IE9 */  
        src: url('./static/webfont.eot?#iefix') format('embedded-opentype'),  
            /* IE6-IE8 */  
            url('./static/webfont.woff2') format('woff2'),  
            url('./static/webfont.woff') format('woff'),  
            /* chrome、firefox */  
            url('./static/webfont.ttf') format('truetype'),  
            /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/  
            url('./static/webfont.svg#webfont') format('svg');  
        /* iOS 4.1- */  
    }  

    body{  
        font-family: "webfont" !important;  
        font-size: 16px;  
        font-style: normal;  
        -webkit-font-smoothing: antialiased;  
        -moz-osx-font-smoothing: grayscale;  

    }  

    .web-font {  
        font-family: "webfont" !important;  
        font-size: 16px;  
        font-style: normal;  
        -webkit-font-smoothing: antialiased;  
        -moz-osx-font-smoothing: grayscale;  
    }  
</style>

index.vue 中


<template>  
    <view>  
        <view class="web-font">我的提哦啊吗阿萨德啊</view>  
    </view>  
</template>  

<script>  
    export default {  

    }  
</script>  

<style scoped>  

</style>
```javascript  

这个是目录结构

2019-12-19 17:11 负责人:无分享

4 个回复

敲木鱼的猪猪侠

文档：iconfont-项目引入本地字体.note链接：http://note.youdao.com/noteshare?id=b44c094ca51536996733c43d0ebb95d1&sub=E69AFC4C9F9548E7BEBE96588F6BF0C5

今天回复我了吗 (作者)

字体图标的我行,中文的引入的好像有点问题

2019-12-19 17:39

DCloud_UNI_GSQ

试试使用阿里字体原来的cdn地址

今天回复我了吗 (作者)

试了一下,效果不知道为什么只有第一个字有变化,..

2019-12-19 17:40

今天回复我了吗 (作者) - uniapp 粉丝条


@font-face {  
  font-family: 'webfont';  
  font-display: swap;  
  src: url('http://at.alicdn.com/t/webfont_kyc7qund0fs.eot'); /* IE9*/  
  src: url('http://at.alicdn.com/t/webfont_kyc7qund0fs.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */  
  url('http://at.alicdn.com/t/webfont_kyc7qund0fs.woff2') format('woff2'),  
  url('http://at.alicdn.com/t/webfont_kyc7qund0fs.woff') format('woff'), /* chrome、firefox */  
  url('http://at.alicdn.com/t/webfont_kyc7qund0fs.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/  
  url('http://at.alicdn.com/t/webfont_kyc7qund0fs.svg#Alibaba-PuHuiTi-Bold') format('svg'); /* iOS 4.1- */  
}  

    .web-font {  
        font-family: "webfont" !important;  
        font-size: 16px;  
        font-style: normal;  
        -webkit-font-smoothing: antialiased;  
        -moz-osx-font-smoothing: grayscale;  
    }

改了cdn 只有第一个字有效果,不是很知道什么原因