Question

自学菜鸟求助：CSS 如何取消导航条中某一个鼠标移动时的背景

我没说清楚，我详细补充一下：

就比如我做一个如上图的导航，我用一个<ul>列表来做，然后logo也算作一个<li>

然后效果为：当鼠标移动到这个<ul>下的任意<li>时，字体变色，背景图片出现。

虽然logo是图片，但由于logo也算<li>，所以如果我logo做了透明图片的话，那么我鼠标移动它上边，他后边也会出现个背景（虽然可以把图片做成不透明来盖住），这是我不希望看到的

如何取消掉这个logo的鼠标移动后背景？

PS：还有。。。要求兼容IE6……谢谢各位

Answer 1

可以新建一个样式，要该动的li引用一下样式即可。。。
eg：
#bbp｛
｝（设置一下）
<li id="bbp">
即可

Answer 2

<ul id="nav">

<li id="logo">不变背景色</a><li>
<li><a href="#">a:hover背景红色</a><li>
<li><a href="#">a:hover背景红色</a><li>
<li><a href="#">a:hover背景红色</a><li>

<ul>

<style>

#nav a:hover{background:red;}
#logo a:hover{background:none;}

</style>

单独给图片那个链接写个样式就行了。

追问

我提问之前试过这种方法，但是不行啊，鼠标移去还是有的

追答

我上面的代码就行。你的估计哪里有问题，写错了，发出来看看

Answer 3

CSS里面加一个cur样式
.cur {}//这里写当前获得焦点后的效果

JS里面的代码如下：
var $list = $("ul li:not(:first)");
$list.mouseover(function(){
$list.removeClass("cur");
$(this).addClass("cur");

})

追问

呃，这个高端了，JS我一点都不会啊。
CSS的话，有解决方法吗？谢谢

Answer 4

有这种效果，一般都是给 li绑定了一个hover属性的
你别给它绑定这个属性就好了

追问

我需要 a:hover 属性啊，导航条我都需要，只有logo不要。

追答

我不知道有什么好办法，给你提供个我的想法吧
你给那些导航条都额外加一个随便什么class，比如就写个navText，logo不加
css写成 a.navText:hover ，这样就不会给logo显示背景了

追问

就是说单独给logo加个class，然后定义他的 :hover背景为none是吗？ 这种方法我试过，可是不管用啊

追答

你搞反了
首先，我估计你的logo和那些导航条都是li下面的a标签里的对吧
我的意思是给logo之外的a标签全加上一个class
然后你定义mouse over 属性的时候不要直接写 a:hover 而是写成a.class:hover

追问

哦，明白了，刚试了一下，是可以的。但是还是会出现一个问题：a.xx:hover 和另一个 a.oo:hover 不能用逗号的方式“缩写”，会出错，所以只能是每个class都复制写一行，css代码就很长……（也可能是我方法错了？我用 a.xx,a.oo:hover和 a.xx,.oo:hover 都试过，会显示错误，只有最后一个class才正常) 求大哥教我一个这种情况的缩写方法``

追答

首先，我看你写的代码就有问题， 你要这么写：
a.xx:hover, a.oo:hover{}

不过呢，你如果就这几个导航条的话，为什么不给他们加一个相同的class