資訊專欄INFORMATION COLUMN
摘要：和元素廣泛用于圖標。可以直接對圖標的屬性進行更改，如圖標的顏色大小，并且可以組合不同的圖標形成所需的圖標等。執行以上步驟，若是沒有圖標顯示，可以打開，檢查字體庫，即引入文件的路徑是否正確。
在前端開發中，許多新手常會遇見一個問題，參考的網頁上有類似下圖的圖標，但在資源里卻找不到對應的文件，這是因為這些網頁使用了圖標庫。這里介紹一種常見的圖標庫——FontAwesome的使用。
1.登錄Font Awesome官網，下載Font Awesome安裝包，最好下載最新版本的，因為最新版本中的更新的子圖圖標相對于老版本數量比較全面
附：Font Awesome官網
http://fontawesome.dashgame.com/
2.下載好壓縮包后，點擊文件夾，找到CSS文件夾里面的font-awesome.css或者font-awesome.min.css（表示壓縮過的）復制到自己項目里面的CSS文件夾中，并把安裝包文件夾中的fonts文件夾整個文件夾復制到自己項目中。
3.打開HTML頁面，在head頭部中引入font-awesome.css。
當然了，如果沒有下載安裝包的，可以引入在線css。
比如：
4.圖標的引用：font-awesome圖標可以任何一個地方引用，只要在該元素的類中加入前綴fa，在加入對應的圖標名稱。不知道圖標的名稱，可以在官網中找到對應的圖標，即可以找到對應的圖標名稱。
、
注：Font Awesome 設計為與內聯元素一起使用。 和 元素廣泛用于圖標。
5.可以直接對圖標的屬性進行更改，如圖標的顏色、大小，并且可以組合不同的圖標形成所需的圖標等。
6.執行以上步驟，若是沒有圖標顯示，可以打開font-awesome.css，檢查字體庫，即引入fonts文件的路徑是否正確。
7.注意事項：引用圖標時，一定要在class類中引入fa，然后在添加圖標的名稱
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/1056.html
摘要：自己制作字體圖標的時候有需要注意這些阿里圖標庫的圖標多，免費但是編輯器不如好用。建議設計師對于一些常用圖標直接去阿里圖標庫找，下載文件即可。 優點 下面的簡介來自，著名字體圖標庫Font Awesome的首頁，http://fontawesome.io： Font Awesome gives you scalable vector icons that can instantly b...
摘要：那么，在我們當下的前端開發中，最常見的圖標解決方案有哪些呢大概是三種，圖片和。 showImg(https://segmentfault.com/img/remote/1460000006774999);A picture is worth a thousand words, 一圖勝千言。 沒錯，從 Web 誕生的那天開始，圖標就成為視覺層面不可或缺的一個元素，在一個 Web 頁面中，...
摘要：那么，在我們當下的前端開發中，最常見的圖標解決方案有哪些呢大概是三種，圖片和。 showImg(https://segmentfault.com/img/remote/1460000006774999);A picture is worth a thousand words, 一圖勝千言。 沒錯，從 Web 誕生的那天開始，圖標就成為視覺層面不可或缺的一個元素，在一個 Web 頁面中，...
摘要：網頁小圖標到處可見，如果一個網頁都是干巴巴的文字和圖片，而沒有小圖標，會顯得非常簡陋。直接看代碼鏈接鏈接鏈接鏈接得出的結果就是其他應用還有其他更加復雜一點的應用，包括固定寬度浮動反轉旋轉疊加圖標等。 引言 奧森圖標（Font Awesome）提供豐富的矢量字體圖標—通過CSS可以任意控制所有圖標的大小 ，顏色，陰影。 網頁小圖標到處可見，如果一個網頁都是干巴巴的文字和圖片，而沒有小圖標...
摘要：文中的一些方法來源于我的有出售請大家自行拷貝粘貼顏色要使用代詞加數字大小形式數字規格顏色變量不許由或者方法計算得出項目顏色基于配色基礎色庫設計師都會配出來項目色庫需要項目去改變設計師文字和前端頁面開發者文字必須為同一類 文中sass的一些方法 來源于我的sassstd zhilizhili-mei zhilizhili-ui npm 有出售 請大家自行拷貝粘貼 showImg(ht...
閱讀 3827·2021-11-25 09:43
閱讀 2170·2021-11-23 10:11
閱讀 1397·2021-09-29 09:35
閱讀 1310·2021-09-24 10:31
閱讀 2035·2019-08-30 15:48
閱讀 2353·2019-08-29 15:28
閱讀 425·2019-08-29 12:36
閱讀 3490·2019-08-28 18:12
