懸停時背景顏色變化

Question

我已經在文本周圍做了方框。 現在我要懸停並更改框的顏色
背景。 當鼠標懸停時，我無法更改該設置。 我還附上了
圖像與此相關，因此您可以了解一下。 我已經在文本周圍做了方框。 現在，我想懸停並更改框背景的顏色。 當鼠標懸停時，我無法更改該設置。 我還附帶了圖像，以便您有想法。請檢查圖像並在鼠標懸停時找到社交媒體框。
懸停顏色沒有變化。

 <style>
 div.ex
 {
     width:20px;
     height:20px; 
     padding:5px;
     border:1px solid #D8D8D8;
     margin:0px;
     background-color:#3b5998;
 }
 </style>


<div class="ex"><span class="iconfacebook2" aria-hidden="true" data-icon="&#xe169;">     
</span></div> 

*編輯以使圖像出現

Answer 1

您可以使用：hover選擇器：

http://www.w3schools.com/cssref/sel_hover.asp

但是，如果您使用的是圖像，則可以應用CSS圖像精靈：

http://www.w3schools.com/css/css_image_sprites.asp

順便說一句，如果您正在開發一個網站，也許CSS Image Sprites是提高網站性能的一個不錯的選擇（因為它只使用1個本地圖像進行多次圖像交互）。

;）

Answer 2

<style>
div.ex
{
width:20px;
height:20px; 
padding:5px;
border:1px solid #D8D8D8;
margin:0px;
background-color:#3b5998;
}
div.ex:hover {
background-color:#000;
}
 </style>

通過使用相同的CSS類div.ex並添加:hover創建一個懸停元素