1. 程式人生 > 其它 >uniapp引入字型圖示(成功方法)

uniapp引入字型圖示(成功方法)

技術標籤: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檔案中使用即可,如圖:

在這裡插入圖片描述