html - 纯 CSS 导航菜单 - 需要根元素在打开时保持黑色

标签 html css navbar

我有一个纯 CSS 导航菜单,我正试图完成它。它几乎完成了,除了一件事:当用户将鼠标悬停在带有子菜单的元素上然后向下导航到子菜单时,根元素会变回白色。当子菜单打开时,我希望根导航元素保持暗色。下面是我目前实现的 CodePen:

http://codepen.io/anon/pen/iJjyb

谁能帮我完成这个?

最佳答案

更改此选择器(第 51 行):

#navmenu > ul li.has-sub > a.active,
#navmenu > ul li.has-sub > a:hover

为此:

#navmenu > ul li.has-sub > a.active,
#navmenu > ul li.has-sub:hover > a

这导致当用户在子菜单中时 :hover Action 仍然处于事件状态,因为它不是 <a> 的子菜单。 - 但是 <li> -标签

关于html - 纯 CSS 导航菜单 - 需要根元素在打开时保持黑色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24308045/

相关文章:

javascript - 从文档正文中插入元标记?

html - Chrome Text Flickr 使用 Css 旋转。 'backface-visibility' 让事情变得更糟

html - CSS:三个盒子,小盒子在大盒子里面,大盒子在最大盒子里面

css - 相对于 parent 的过渡规模

html - 如何让导航栏完全显示并居中对齐

html - 从左到右居中对齐 float 导航栏和下拉菜单

jquery - 基础导航从左向右滑动

html - 应用程序缓存在 IE 中的位置

html - 在html或css中指定图像大小的区别

javascript - 如何使两个函数在单击时使用react