uniapp引入字体图标(手机端无法显示)

一、在iconfont官网下载字体图标:

选择第二个进行下载,不然会导致手机端无法显示
在这里插入图片描述

二、下载好的文档解压好后,放入static中:

在这里插入图片描述

三、将文件夹名字改成font

在这里插入图片描述

四、在App.vue中引入代码如下:

<script>
   //引入样式
	import "./static/font/iconfont.css"
	export default {
    
    
		onLaunch: function() {
    
    
			console.log('App Launch')
		},
		onShow: function() {
    
    
			console.log('App Show')
		},
		onHide: function() {
    
    
			console.log('App Hide')
		}
	}
</script>

<style>
	/*每个页面公共css */
	
</style>


五、在vue文件中使用即可,如图:

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/QZ9420/article/details/112499141