CSS - 如何通过简单的

与多级菜单的工作我有一个多级菜单看起来像CSS - 如何通过简单的

enter image description here

我想我的菜单

具有相同的背景（＃5b740d如您所见）
具有相同的活动背景（红色，如您所见）
具有相同的悬停背景（红色，如您所见）

而且上述三个选项将所有菜单和子菜单
但我的代码看起来像复杂。下面是悬停我的示例代码

/* hover: can using a simple selector to make all are same background */ 
.menu li:hover { 
    background: red; 
} 
.menu li li ul li a:hover { 
    background: red; 
} 
.menu li ul li:hover a { 
    background: red; 
}

我得到互联网上的CSS，但它是复杂的，然后我用我的方式改变它（但它仍然复杂:(plz帮助我使简单）。
但我得到的错误：当我在我的照片（2），如悬停项目波纹管，然后按项目（3）为悬停

enter image description here

PLZ简化我的CSS代码做上述三个选项（我不明白复杂吗？代码:(）并帮助我修复我的bug谢谢

这里是我的代码http://jsfiddle.net/SWF6w/

来源

2013-08-23 freestyle

有没有办法使这个更“简单”，有在该代码非常少多余的标记或定义，所以我真的不明白你的吸引力，使它更简单。

不过，您可以通过在li:hover a选择器上指定直接后代选择器来轻松修复子元素上的红色悬停。例如：

.menu li ul li:hover > a { 
    background: red; 
}

会产生这样的结果>http://jsfiddle.net/SWF6w/1/

来源

2013-08-23 15:50:46 BenM

我认为这可以更简单：我只是编辑一些东西，只需要'.menu li：hover { \t background：red; }'这里是我的代码：http://jsfiddle.net/urybX/。我认为如果你从一开始就设计我的想法，我认为代码更简单。但我不能，任何人都可以帮助我，谢谢 – freestyle

当然，聘请一名开发人员。没有人会为你免费写作。 – BenM

谢谢你我会尽我所能 – freestyle

替换这一段代码：

.menu li li ul li a:hover { 
    background: red; 
} 
.menu li ul li:hover a { 
    background: red; 
}

有了这一个：

.menu li li ul li>a:hover { 
    background: red; 
} 
.menu li ul li:hover>a { 
    background: red; 
}

在这里被更新的jsfiddle：http://jsfiddle.net/SWF6w/2/

来源

2013-08-23 15:51:21 gabitzish

不需要第一次改变。 – BenM

CSS - 如何通过简单的

回答

相关问题