将下拉菜单父级背景设置为透明，使子级不透明

Question

http://eaglesflight.sites.hubspot.com/conference顶部附近有一个导航菜单，我希望父项（培训，公司，资源）具有透明背景，同时保持孩子在悬停时的当前不透明度。 / p>

基本上，我希望能够在导航的父项后面看到背景图像，而不是当前那里的纯色。

我是一名业余爱好者，负责在工作中进行一些网络开发。非常感谢任何帮助。

Answer 1

  

...同时保持孩子们当前悬停的不透明度。

所以您似乎已经尝试将opacity设置为元素：

.hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children 
{
   position: relative;
   opacity: 0.8;
}

现在确实，子元素也有这种悬停。这是因为父元素“更强”。你可以在悬停时重新调整opacity：

.hs-menu-item.hs-menu-depth-1.hs-item-has-children:hover 
{
   opacity: 1;
}

jsFiddle

注意COMPANY不是半透明的，因为它没有子元素。如果需要，可以通过将没有子元素的元素包含在半透明不透明度

中来更改此值

---

希望这有助于你：）

Answer 2

从background: #1d3d6f移除.nav-menu li并将其添加到.hs-menu-children-wrapper

悬停时，请从background: #fff

中删除.nav-menu a:hover

如果你没有设置背景颜色，你会看到元素背后的内容。