<分区>
标签 css
<分区>
这段代码有问题
<ul style="position: absolute; z-index: 999999999;">
<li><a href="#" id="home_link">Home</a></li>
<li><a href="#" id="hits_link">music</a></li>
<li><a href="#" id="cinema_link">cinema</a></li>
<li><a href="#" id="shows_link">shows</a></li>
<li><a href="#" id="timeout_link">timeout</a></li>
<li><a href="#" id="win_link">win</a></li>
</ul>
<div id="logo"></div>
当悬停在任何“a”上时，我需要更改 div#logo 的背景位置
尝试了这个 CSS 选择器，但没有成功
ul li a#hits_link:hover + div#logo{background-position:-198px 0px;}
请指教
最佳答案
你根本不能这样做，因为 #logo 不是 #hits_link 的相邻兄弟。
我创建了一个 fiddle here演示相邻 sibling 的意思。
#logo 与 #hits_link 没有任何关系，所以据我所知，您将需要 js 片段的帮助才能完成类似的操作。
使用 JQuery.. 你可以做类似的事情
$("#hits_link").hover(function() {
$("#logo").css("background-position", "-198px 0px");
},function() {
$("#logo").css("background-position", "0px 0px");
});
这是一个demo也是如此。
更新: 在这种情况下，第二个函数是将背景位置恢复为 0 0。
如果你想让它保持那样，就只用这个
$("#hits_link").hover(function() {
$("#logo").css("background-position", "-198px 0px");
});
检查 demo
关于css - 我怎样才能使用 CSS 选择器来解决这个问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9092311/