阿里矢量图网址:https://www.iconfont.cn/
1、先创建【我的项目】
2、 【选择图标】,【添加入库】,【添加至项目】
3、【下载至本地】
4、解压之后,把【iconfont.css】文件复制到uniapp的本地项目中
5、在步骤3的图中,选择【查看在线链接】
6、复制上述代码到 【iconfont.css】文件中,整个替换掉【@font-face】部分,并在【//】前追加【https:】,如下所示:
7、 在项目中的引用如下,可以使用style设置一些样式:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <template> <view class="box"> <view class="iconfont icon-email">email</view> <view class="iconfont icon-favorite" style="font-size:40px">favorite</view> <view class="iconfont icon-search" style="color:blue;">search</view> </view> </template> <script> export default { data() {return {}}, methods: {}, } </script> <style lang="scss" scoped> @import '../../css/iconfont.css'; .box { padding: 50rpx; } </style> |