gpt4 book ai didi

html - 为什么悬停不起作用?此代码用于在我的网站中显示社交网络图标

转载 作者:行者123 更新时间:2023-11-28 03:49:07 25 4
gpt4 key购买 nike

看看我的 html 代码,告诉我为什么 Hover 不起作用?此代码用于在我的网站中显示社交网络图标。我使用 a: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>

最佳答案

你应该

a:hover > socialNetIcons {
color: red
}

代替

a:hover {
color: red
}

a:悬停所有文本但不是其中的图标。

关于html - 为什么悬停不起作用?此代码用于在我的网站中显示社交网络图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43818391/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com