选择后如何更改菜单背景颜色?

use*_*668 3 css jquery css3

我这几天开始学习CSS,目前我有一个CSS任务,我已经尝试但是我没有得到它..

这是我的要求:

The site is http://mywebsite.com/ .  
Run Code Online (Sandbox Code Playgroud)

你会注意到菜单栏有悬停的颜色#1B3E70.这是我想要选择的菜单栏项目在相应区域/页面上显示的颜色.

我尝试如下,但没有得到:

 a:visited{
    background: #1B3E70;
}
Run Code Online (Sandbox Code Playgroud)

请建议我..

sur*_*wat 6

参考您的链接(类和ID):

HTML

<li class="menu-item">
    <a href="#">About</a>
    <a href="#">Home</a>
</li>
Run Code Online (Sandbox Code Playgroud)

CSS

 .menu-item{
        list-style:none;
    } 
    .menu-item a{
        padding:20px;
        padding-bottom:10px;
        border:1px solid #1B3E70;
        color:#1B3E70;
        text-decoration:none;
    }.menu-item a:hover{
            background-color:#1B3E70;
        color:white;
    }
    .menu-item .active{
         background-color:#1B3E70;
         color:white;

    }
Run Code Online (Sandbox Code Playgroud)

jQuery的

    $('.menu-item a').click(function(){
    $(this).addClass('active').siblings().removeClass('active');
    });
Run Code Online (Sandbox Code Playgroud)

实例http://jsfiddle.net/7VBy9/