如何使用chrome擴展在網頁中繪製圖標？

我構建了一個Chrome擴展，以突出顯示網頁上的電話號碼。除了突出顯示數字之外，我還希望在每個數字的末尾添加一個圖標。這裏我有兩個選擇：如何使用chrome擴展在網頁中繪製圖標？

字體真棒圖標存在問題。當我嘗試字體真棒unicodes他們渲染爲空白方塊和fa電話類，沒有任何渲染，可能是因爲特定的網站可能不支持字體真棒圖標。我不知道如何解決這個問題。

如果字體真棒不是一個好主意，那麼我想知道，我如何在<span>附加.ico文件。

你是否記得附加CSS文件（樣式表），這可能是爲什麼你得到錯誤。 – WebGuy

字體真棒？ –

是的，您需要下載CSS文件並以某種方式附加到頁面上。 – WebGuy

我對擴展程序知之甚少，但網頁基本上是由HTML和CSS構建的。

FontAwesome應首先與頁面鏈接，然後添加HTML代碼以顯示圖標。

圖標可能未顯示，因爲您有HTML代碼但未將CSS鏈接到頁面。所以不知何故，你需要鏈接CSS文件和頁面。

您可以將鏈接添加到CSS文件，像這樣（需要託管的CSS文件）：

<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

或附加的擴展名的文件，所以它並沒有從網站獲取（推薦方法）。

2017-09-08 10:35:55 WebGuy

我不知道這將如何在Chrome擴展中完成，但它應該是可能的，因爲有其他擴展能夠做到這一點。 – WebGuy

我不認爲這是好的，修改其他網站的元標記。 –

爲什麼不將css文件存儲在擴展中，只需在頁面上添加HTML代碼片段（圖標代碼）即可。這是不可能和充足的？ – WebGuy

回答