1.登入http://www.iconfont.cn 可以用github帳號登入

2.點選導航欄上的圖示庫

3.選擇自己需要的圖示,加入購物車

4.點選右上角購物車

5.點選新增至專案,沒有專案要新建一個

6.在新開啟的頁面,點選Font class和檢視線上連結

下面就是如何在專案中使用.本例以vue-cli搭建的專案為例

1.首先在index.html頁面引入我們新增的圖示樣式

http: 後面的部分就是線上連結顯示的url

2.具體使用

之前的介面

現在來新增圖示,比如我們要使用支付寶錢包的圖示

點選複製程式碼,然後在頁面中使用,比如在<H1>的下面使用

<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <i class="iconfont icon-rectangle390"></i>
    <h2>Essential Links</h2>

其中紅色部分是固定寫法,後面就是你需要的圖示樣式

稍微修改下樣式,改變顏色,增加字型大小

最後效果圖

簡單的使用到此就OK了