1. 程式人生 > 實用技巧 >阿里巴巴向量圖示庫的使用

阿里巴巴向量圖示庫的使用

在參考小米官網寫頁面你時,會發現小米中有很多的向量圖示,小米的圖示或許是自己的,但是我們寫頁面時要用到向量圖示時怎麼辦,可以使用阿里提供的圖示庫

阿里向量圖示庫網址:https://www.iconfont.cn/?spm=a313x.7781069.1998910419.d4d0a486a 註冊一個賬號就可以免費的使用了。

使用方法如下:

第二步

第三步

新增購物車

程式碼下載後會有一個如下的資料夾,複製到自己的專案中

下面簡單的使用一下:

<!DOCTYPE html>
<html>
    <head>
        <meta charset
="utf-8" /> <title></title> <!-- 第一步引入 iconfont.css --> <link rel="stylesheet" type="text/css" href="font_fupby3jjl5e/iconfont.css"/> </head> <body> <span class="iconfont icon-sousuokuang" style="color: #0086B3;"></span>
<!-- 第一種 --> <span class="icon iconfont">&#xe628;</span> <!-- 第二種 --> <!-- 第三種我沒有使用過可以參考 demo_index.html 檔案--> </body> </html>

向量圖示就相當於文字一般,它可以使用文字的屬性比如修改顏色,改變字型大小,字型居中等屬性,所以在處理向量圖示時比圖片更加的方便簡潔。

個人學習,內容簡略。