font awesome使用方法

2021-10-09 17:38:35 字數 1314 閱讀 4762

安裝font-awesome，由於font-awesome沒有什麼依賴，所以安裝最新版本即可

yarn add font-awesome
在webpack.config.js中進行如下配置

const path =


require


('path');


const htmlwebpackplugin =


require


('html-webpack-plugin'


)const extracttextplugin =


require


('extract-text-webpack-plugin');


const webpack =


require


('webpack');


module.exports =


,  plugins:


[// 處理html檔案


newhtmlwebpackplugin()


,// 提出css檔案


newextracttextplugin


("css/[name].css"),


// 提出公共模組


newwebpack.optimize.commonschunkplugin()


],module:}}


,// css語法處理)}


,// sass檔案的處理


,// 配置,}


,],}


,// 字型圖示配置,}


,],}


,]}}


;
在index.js(x)中引入font-awesome

import


'font-awesome/css/font-awesome.min.css'
在font-awesome**上尋找想用的標籤，並複製，這裡推薦在寫本部落格的時候，上的標籤無法開啟

將複製的名稱作為建立標籤的class名，即可使用該字型圖示

reactdom.


render


(// 這裡fa fa-user-circle-o 可以在上面提到的**中查詢


'fa fa-user-circle-o'


>


<


/i>


hello jsx<


/h1>


<


/div>


,    document.


queryselector()


)
也可以在boot***中複製font-awesome的link標籤放入全域性html檔案中

Font Awesome使用簡介

font awesome 是一種用字型來實現圖示的 css外掛程式。使用方法 到 包解壓到本地後，結構如下 在網頁中引用 css font awesome.css 或者css font awesome.min.css 比如 在網頁中用如下的方式來顯示圖示。效果如下 既然是一種字型，就可以通過改變字型...

Font Awesome 使用指南

font awesome 簡稱fa 是一套圖示庫，有這些優良的特性 除了讓使用者可以在1000多個高質量圖示內選擇圖示之外 無極縮放。如何字型一樣使用圖示，指定大小即可，不必擔心變大後圖示變形的問題 可以指定顏色，背景色，就如同字型一樣 實際上，技術上來說，這套圖示不再是乙個個的，而是一套字型，如同...

pythonpip使用方法 pip使用方法整理

匯出專案已安裝的pip包 pip list 檢視專案中安裝的包 pip freeze requirements.txt 將專案中所用到的第三方庫輸出到requirements.txt中 pip install 版本號 pip install i 本次使用清華源進行安裝 離線安裝第三方庫 一鍵安裝整個...