Google除了提供免費的字型外,最近還釋出了近2000組的Icon Font圖示,而平常所會用到的圖示應有盡有,同時免註冊、免下載,直接引用雲端的服務至網頁中,立即就可使用Google所釋出的Icon Font圖示囉!因此身為網設的你,也千萬別錯過了。
Material icon
網站名稱:Material icon
網站連結:https://material.io/resources/icons/
網站連結:https://material.io/resources/icons/
Step1
在進入Google所提供的免費圖示的平台Meterial icon,先點右邊中間的連結。
Step2
進入後,再把引用的連結複製起來。
Step3
貼到網頁的<head>~</head>之間。
Step4
引用好後,再回到Material Design的平台,搜尋要使用的圖示。
Step5
當選擇好後,點一下圖示,再點左下角的灰色按鈕。
Step6
接著再把下方的HTML語法複製。
Step7
再貼到網頁的<body>~</body>,這時就會看到剛剛所選擇的圖示。
Step8
由於是Icon Font,因此是可透過CSS來改變圖示的顏色與大小,但在改變大小時,卻會出現沒反應。
Step9
而解決辦法很簡單,只需要在後方加入!important後,立即就會套用上去啦!因此身為網設的你,也趕快來試用看看囉!
#範例展示: