透明引导下拉菜单

Question

我正在尝试制作像这样的引导菜单 https://makr.com/

我做得很好，但我还没有想出如何让它完全透明一次悬停。

正如您在下面的小提琴中看到的那样，当我悬停时，下拉菜单中总是有一些灰色阴影。

我真的不知道我还能做些什么......我昨天和今天早上都在谷歌上搜索并寻找解决方案，但我现在真的陷入了困境。

任何人都可以看看小提琴并给我建议，非常感谢

应该在菜单中的唯一颜色是

.navbar-default { 
  background-color: transparent; border-color: transparent;
  } 
.navbar-default :hover { 
   background-color: rgba(248, 248, 248, .7); border-color: rgba(231, 231, 231, .7)
{

悬停时

https://jsfiddle.net/dadihall/5zzcq2t5/22/

提前致谢 大地

Answer 1

试试这个：

.navbar:hover {
background: rgba(248, 248, 248, 0.7) none repeat scroll 0 0 !important;
  }
 .navbar-default *:hover{
 background:transparent !important;
 }

见fiddle.

Answer 2

您好，请尝试以下 css

    .dropdown.full-width {
width : 120px;
background-image: transparent;
background-color: transparent;
}

.full-width.dropdown > .dropdown-menu > li > a {
white-space: normal; 
 background-image: transparent;
background-color: rgba(255,255,255,0.5); //or any level of transparency
} 

    .full-width.dropdown > .dropdown-menu > li > a:hover {
background-color: rgba(255,255,255,0.5); //or any level of transparency
}