1. 程式人生 > 程式設計 >十步搞定uni-app使用字型圖示的方法

十步搞定uni-app使用字型圖示的方法

uni-app簡介

uni-app是一個使用Vue.js開發跨平臺應用的前端框架,開發者編寫一套程式碼,可編譯到iOS、Android、H5、小程式等多個平臺。

  uni-app框架由Dcloud即數字天堂(北京)網路技術有限公司推出,該公司主要產品有Web開發IDE Hbuiler、HbuilderX,前端框架mui、uni-app,增強版的手機瀏覽器引擎H5plus等。

uni-app中使用字型圖示圖示的下載

首先去阿里圖示庫選擇要用的圖示,並且打包下載下來,步驟如下

1.

在這裡插入圖片描述

2.

在這裡插入圖片描述

3.

在這裡插入圖片描述

4.

在這裡插入圖片描述

5.

在這裡插入圖片描述

6. 本地檔案選取

在這裡插入圖片描述

7. 貼上到uni-app專案下的static靜態資原始檔下

在這裡插入圖片描述

8. 把下載好的圖示包裡的iconfont.css內的程式碼貼上到uni-app專案中的App.vue檔案內

在這裡插入圖片描述

9. 在紅色標記框的前面對路徑進行修改

藍色的框選是新增的

在這裡插入圖片描述

10. 使用

檢視下載包內的demo_index.html檔案

在這裡插入圖片描述

總結

到此這篇關於十步搞定uni-app使用字型圖示的方法的文章就介紹到這了,更多相關uni-app 字型圖示內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!