ColorUI + Iconfont

ColorUI下直接用iconfont，圖標會顯示亂碼。各們同學可以試下以下方法。

1.首先在iconfont官網下載你的圖標代碼，然后解壓壓縮包（名字一般是download.zip)，解壓后可以看到文件夾里有多個文件。

下載步驟

先把需要的圖標加到庫，然后添加到項目,選擇或創建一個項目（也可以直接下載代碼）

?

之后點確定，進入項目頁，選擇下載至本地

這里請留意里面的 iconfont.ttf ?

2.瀏覽器打開網址：https://transfonter.org/ ，按下圖操作

等待一段時間后，covert成功手，add fonts 按扭會變成一個download 字樣按扭，點擊下載。解壓包后，會有一個stylesheet.css文件，用編輯器打開。

然后將修改后的這段代碼 及其后的樣式定義拷到你的wxss文件中，font-display: swap;這個配置可以刪除

3、在wxss中為圖標配置名稱

.cuIcon-wdd:before {content: "\e60b"; }

之后在需要使用的地方直接寫class="cuIcon-wdd"即可

總結

以上是生活随笔為你收集整理的colorui 使用iconfont图标的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。