改变主动

Question

你好，我试图改变我的菜单项的背景色当过一个网页是主动或选择，我使用CSS尝试了正常的方式，这是我曾尝试

WordPress的导航项目菜单背景颜色

#tve_editor .thrv_widget_menu.thrv_wrapper ul.tve_w_menu a:selected { 
    color: #373737; 
    text-decoration: none; 
    display: inline-block; 
    line-height: 1; 
    padding: 10px 0; 
    position: relative; 
    background-color: blue; 
} 
#tve_editor .thrv_widget_menu.thrv_wrapper ul.tve_w_menu a:active { 
    color: #373737; 
    text-decoration: none; 
    display: inline-block; 
    line-height: 1; 
    padding: 10px 0; 
    position: relative; 
    background-color: blue; 
} 

#tve_editor .thrv_widget_menu.thrv_wrapper ul.tve_w_menu a:current { 
    color: #373737; 
    text-decoration: none; 
    display: inline-block; 
    line-height: 1; 
    padding: 10px 0; 
    position: relative; 
    background-color: blue; 
} 

这就是我想实现

这是本页面，您可以看到菜单的状态： web link

有没有其他方法可以让我的菜单看起来这样？

Answer 1

#tve_editor .thrv_widget_menu.thrv_wrapper ul.tve_w_menu li.current-menu-item > a { 
    color: #373737; 
    text-decoration: none; 
    display: inline-block; 
    line-height: 1; 
    padding: 10px 0; 
    position: relative; 
    background-color: blue; 
} 

Answer 2

你需要使用悬停CSS选择器。看看这里！ http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_link_more1

类似：

#tve_editor .thrv_widget_menu.thrv_wrapper ul.tve_w_menu a:hover { 
    color: #373737; 
    text-decoration: none; 
    display: inline-block; 
    line-height: 1; 
    padding: 10px 0; 
    position: relative; 
    background-color: yellow; 
}