作爲字體使用的HTML/CSS圖標 - 懸停更改顏色

Question

我正在考慮開始使用這種技術的圖標作爲字體，因爲它看起來很棒。但我似乎無法弄清楚如何改變鏈接懸停的顏色。這裏是一個的jsfiddle你一起玩：

http://jsfiddle.net/eNhUf/17/

正如你所看到的，當你懸停像「謹慎」，文雲藍，文字我也想圖標/字體去藍色以及。

有誰知道如何做到這一點？

謝謝。

Answer 1

.caution.icon:hover:before{content:"\0021";color:green } 

這將使當您懸停鏈接警告圖標綠色環保，我敢肯定，你可以自定義的想法，只要你喜歡！ http://jsfiddle.net/agentmilindu/eNhUf/24/

Answer 2

字體圖標庫通常使用預先生成的內容將圖標註入到元素中。這意味着您需要定位該區域並設置顏色。

<p class="icon caution email">Email</p> 
<style type="text/css"> 
    .icon.caution, .icon.caution:before { color:blue; } 
</style> 

Answer 3

試試這個：

.icon:hover, .icon:hover:before { color: blue; }