字体图标添加
1.需要到阿里矢量图标库添加
2.添加后Unicode下载并替换@/styles/font下文件
3.在线图标方式
复制阿里矢量图标库->我的项目->Unicode->查看在线链接的@font-face并替换iconfont.css的@font-face,并在每个链接前添加https:
3.本地图标方式
iconfont.css中用下方代码替换@font-face
@font-face {
font-family: 'iconfont';
src: url('@/styles/font/iconfont.eot');
src: url('@/styles/font/iconfont.eot?#iefix') format('embedded-opentype'),
url('@/styles/font/iconfont.woff2') format('woff2'),
url('@/styles/font/iconfont.woff') format('woff'),
url('@/styles/font/iconfont.ttf') format('truetype'),
url('@/styles/font/iconfont.svg#iconfont') format('svg');
}
4.复制下方代码放到iconfont.css中
text[class*="icon-"],
view[class*="icon-"],
button[class*="icon-"] {
font-family: "iconfont";
font-size: inherit;
font-style: normal;
}
5.使用方法
<view class="icon-success-filling" style="color: #0087fe; font-size: 25rpx;"></view>
注意:如果你用的是uview,请参照这篇文档配置https://www.uviewui.com/guide/customIcon.html
本文介绍如何从阿里矢量图标库添加字体图标,包括下载Unicode、替换font-face、使用在线链接及本地图标文件,并提供UView配置示例。重点讲解了添加和在HTML中使用的步骤。
716

被折叠的 条评论
为什么被折叠?



