uniapp在h5页面icon图标可以显示，打包成支付宝小程序无法显示icon,请教一下

分类：uni-app

style文件下 index.scss
main.js import './style/index.scss';

@font-face {
font-family: fonticon;
user-select: none;
src: url('@/static/font/iconfont.eot');
src: url('@/static/font/iconfont.eot') format('embedded-opentype'),
url('@/static/font/iconfont.svg') format('svg'),
url('@/static/font/iconfont.woff') format('woff'),
url('@/static/font/iconfont.ttf') format('truetype');
}

[class^=''] {
font-family: fonticon;
vertical-align: middle;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-arrow::before {
content: '\e607';
}

2021-01-28 16:20 负责人:无分享

2 个回复

1***@qq.com (作者)

支付宝小程序写法：

// #ifdef MP-ALIPAY
@font-face {
font-family: 'fonticon';
user-select: none;
src: url('@/static/font/iconfont.eot');
src: url('@/static/font/iconfont.eot') format('embedded-opentype'),
url('@/static/font/iconfont.svg') format('svg'),
url('@/static/font/iconfont.woff') format('woff'),
url('@/static/font/iconfont.ttf') format('truetype');
}

.fonticon {
font-family: 'fonticon' !important;
vertical-align: middle;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

// #endif

超级酱油

折腾了一上午中午好了
按题主的方法试了下
发现只能支付宝只能使用本地字体文件且不支持woff2类型
我试了下只倒入ttf文件就可以

@font-face {  
    font-family: '自定义名称';  
    user-select: none;  
    src: url('~@/static/iconfont.ttf') format('truetype');  
}

该问题目前已经被锁定, 无法添加新回复

uniapp在h5页面icon图标可以显示，打包成支付宝小程序无法显示icon,请教一下

2 个回复

公告

相关问题

uniapp在h5页面icon图标可以显示，打包成支付宝小程序无法显示icon,请教一下

与内容相关的链接

2 个回复

公告

相关问题