如何更改活跃的子菜单的背景在我weebly（CSS）代码

我有一个问题...有在CSS没有EXP所以我只是想弄清楚这一点，但我不能......如何更改活跃的子菜单的背景在我weebly（CSS）代码

在我做的Weebly网站我想子菜单有一个“活跃”的背景下，我知道该怎么做，但它不工作，我不知道为什么不？我也想在菜单上也保持活跃过（但仍然可点击），即使在它的子菜单处于活动状态。

https://postimg.org/image/6s8phmliv/这里是我的意思的图像，当我将鼠标悬停它，我得到了我想要得到的颜色。我需要一个背景色（＃657a8f）和字体颜色（＃97da6f），用于当它处于活动状态也不会为它恢复正常（颜色：＃b9b9b9;背景：＃657a8f;）当我不要过度它悬停。同样，我无法弄清楚如何保持“SHOWREEL”还强调，仿佛活跃（它具有相同的活性颜色的徘徊，在子菜单

这里是我的代码：

/* Nav */ 
.nav { 
    text-align: center; 
    background: #4c5a67; 

} 
.nav ul { 
    display: inline-block; 
    vertical-align: top; 
    list-style-type: none; 

} 
.nav ul li { 
    position: relative; 
    display: inline-block; 
} 
.nav ul li a { 
    display: block; 
    padding: 1em; 
    color: #b9b9b9; 
    text-transform: uppercase; 
    letter-spacing: .07em; 
    font-family: 'Quattrocento Sans', sans-serif; 
    font-size: 22px; 
    font-weight: 400; 
    line-height: 19px; 
    -webkit-transition: all 300ms linear; 
    -moz-transition: all 300ms linear; 
    -ms-transition: all 300ms linear; 
    -o-transition: all 300ms linear; 
    transition: all 300ms linear; 
} 
.nav ul li#active > a.wsite-menu-item, 
.nav ul li > a.wsite-menu-item:hover { 
    color: #97da6f; 
    background: #657a8f; 
} 
.mobile-nav { 
    display: none; 
} 
/* Submenu */ 
#wsite-menus .wsite-menu { 
    border-top: 1px solid #b9b9b9; 
    width: 170px; 
} 
#wsite-menus .wsite-menu li a { 
    color: #b9b9b9; 
    background: #657a8f; 
    border: none; 
    text-transform: Capitalize; 
    letter-spacing: .07em; 
} 
#wsite-menus .wsite-menu li:last-child a { 
    background: #4c5a67; 
    border-bottom: none; 
    width: 160px; 
    border-top: 1px solid #b9b9b9; 
    border-bottom: 1px solid #b9b9b9; 
    font-size: 17px; 
} 
#wsite-menus .wsite-menu li:first-child a { 
    background: #4c5a67; 
    border-bottom: none; 
    width: 160px; 
    font-size: 17px; 
} 
.nav ul li#active > a.wsite-menu-item{ 
    color: #97da6f; 
    background: #657a8f; 
} 
.nav ul li > a.wsite-menu-item:hover, 
#wsite-menus .wsite-menu li a:hover { 
    background: #657a8f; 
    color: #97da72; 
} 
#wsite-menus .wsite-menu li a:hover .wsite-menu-arrow:before { 
    background: #657a8f; 
    color: #97da72; 
} 
#wsite-menus .wsite-menu-arrow { 
    background: #657a8f; 
    color: #97da72; 
    font-size: 0; 
} 
#wsite-menus .wsite-menu-arrow:before { 
    background: #657a8f; 
    display: block; 
    color: #97da72; 
    content: '\203A'; 
    font-family: 'Quattrocento Sans', sans-serif; 
    font-size: 24px; 
    font-weight: normal; 
    line-height: 11px; 
}[enter image description here][1]

感谢这么多的帮助！我真的不知道多少，我刚落，在不同的代码的东西，看看它是否更新了正确的事情，所以我不知道..可能也做了一个烂摊子呢？

来源

2016-07-24 Dor

这是一个纯粹的猜测，因为如果没有完整的代码就很难测试：

加入CSS：

.nav ul li > a.wsite-menu-item:active,, .nav ul li > a.wsite-menu-item:focus { 
    background: orange; 
}

来源

2016-07-24 15:19:14 Toby

对于主导航菜单，（文本），可以使用：

.nav ul li#active a { 
    color: #97da6f; 
}

对于主导航的背景，你可以使用：

.nav ul li#active { 
    background: #657a8f; 
}

此，因为Weebly添加ID = “有效” 到主NAV。

〜

的下拉式选单（子NAV），而另一方面，Weebly不适合做这个。因此，您需要将其作为功能请求提交给他们的社区页面。

来源

2016-07-26 00:22:13

如何更改活跃的子菜单的背景在我weebly（CSS）代码

回答

相关问题