爲什麼懸停不起作用？此代碼用於在我的網站上顯示社交網絡圖標

查看我的html代碼並告訴我爲什麼哈弗不起作用？此代碼用於在我的網站中顯示社交網絡圖標。我使用：hover {color：red;}但它不起作用。爲什麼懸停不起作用？此代碼用於在我的網站上顯示社交網絡圖標

<!DOCTYPE html> 
<html> 
<head> 
<style> 
.socialNetIcons { 
    background: url(newiconset4.png); 
    height: 30.5px; 
    width: 30.5px; 
    float: left; 
    margin-right: 2px; 
    cursor: pointer; 
} 
a:hover {color: red;} 
#facebook {background-position: 0px 0px;} 
#linkedin {background-position: 0px -30.5px;} 
#aparat {background-position: 0px -61px;} 
#instagram {background-position: -30.5px 0px;} 
#youtube {background-position: -30.5px -30.5px;} 
#yahoo {background-position: -30.5px -61px;} 
#twitter {background-position: 61px 0px;} 
#telegram {background-position: 61px -30.5px;} 
#rss {background-position: 61px -61px;} 
#google {background-position: -91.5px 0px;} 
#skype {background-position: -91.5px -30.5px;} 
#behance {background-position: -91.5px -61px;} 
</style> 
</head> 
<body> 
<div class="socialNet"> 
    <a href="http://facebook.com" target="_blank"> 
     <div class="socialNetIcons" id="facebook"></div> 
    </a> 
    <a href="http://instagram.com" target="_blank"> 
     <div class="socialNetIcons" id="instagram"></div> 
    </a> 
    <a href="http://twitter.com" target="_blank"> 
     <div class="socialNetIcons" id="twitter"></div> 
    </a> 
    <a href="http://plus.google.com" target="_blank"> 
     <div class="socialNetIcons" id="google"></div> 
    </a> 
    <a href="http://linkedin.com" target="_blank"> 
     <div class="socialNetIcons" id="linkedin"></div> 
    </a> 
    <a href="http://youtube.com" target="_blank"> 
     <div class="socialNetIcons" id="youtube"></div> 
    </a> 
    <a href="http://telegram.com" target="_blank"> 
     <div class="socialNetIcons" id="telegram"></div> 
    </a> 
    <a href="http://skype.com" target="_blank"> 
     <div class="socialNetIcons" id="skype"></div> 
    </a> 
    <a href="http://aparat.com" target="_blank"> 
     <div class="socialNetIcons" id="aparat"></div> 
    </a> 
    <a href="http:/mail.yahoo.com" target="_blank"> 
     <div class="socialNetIcons" id="yahoo"></div> 
    </a> 
    <a href="http://rss.com" target="_blank"> 
     <div class="socialNetIcons" id="rss"></div> 
    </a> 
    <a href="http://behance.net" target="_blank"> 
     <div class="socialNetIcons" id="behance"></div> 
    </a> 
</div> 
</body> 
</html>

來源

2017-05-06 shp

你應該

a:hover > socialNetIcons { 
    color: red 
}

，而不是

a:hover { 
    color: red 
}

答：懸停所有文本，但裏面沒有圖標。

來源

2017-05-06 08:40:51

我看到你的標籤內的圖標是圖像，所以你不能改變它們的顏色。 –

它仍然不起作用！ :( – shp

@shp正如我上面說的，你的圖標是圖像，所以你不能改變它們的顏色 –

爲什麼懸停不起作用？此代碼用於在我的網站上顯示社交網絡圖標

回答

相關問題