简单导航条，求指点代码哪里有问题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>导航条</title>
    <style type="text/css">
        .menu{
            width: 700px;
            height: 40px;
            border: 0;
            margin: 50px auto 0;
            list-style: none;
            padding: 0;
            line-height: 40px;
            text-align: center;
            font-size: 0;
            background: #55a8ea;
        }
        .menu li{
            display: inline-block;
            width: 100px;
            text-align: center;
            line-height: 40px;
        }
        .menu a{
            text-decoration: none;
            font-size: 14px;
            font-family: Microsoft Yahei;
            color: white;
        }
        .menu .active{
            background: #00619f;
        }
    </style>>
</head>
<body>
    <ul class="menu">
        <li class="active"><a href="">首页</a></li>
        <li><a href="">网站建设</a></li>
        <li><a href="">程序开发</a></li>
        <li><a href="">网络营销</a></li>
        <li><a href="">企业VI</a></li>
        <li><a href="">案例展示</a></li>
        <li><a href="">联系我们</a></li>
    </ul>
</body>
</html>

您的 .menu .active{
background: #00619f;
}
应该替换为
.menu li:hover{
background: #00619f;
}
，您怕是要的这个效果吧

需要为 a 添加点击事件，点击时清除上次的 active 样式，并为当前链接添加选中样式，在 header 后面加脚本如下：

</head>
<script>
   function click(index){     
      // 去掉上一次的 active 样式
      var active = document.getElementsByClassName("active");
      active[0].classList.remove("active");

      // 为当前点击的菜单添加选中样式，通过 tagName 获取 对应下标的 li
      var lis = document.getElementsByTagName("li");
      lis[index].classList.add("active");
   }
</script>
<body>
    <ul class="menu">
        <li class="active"><a href="javascript:click(0);">首页</a></li>
        <li><a href="javascript:click(1);">网站建设</a></li>
        <li><a href="javascript:click(2);">程序开发</a></li>
        <li><a href="javascript:click(3);">网络营销</a></li>
        <li><a href="javascript:click(4);">企业VI</a></li>
        <li><a href="javascript:click(5);">案例展示</a></li>
        <li><a href="javascript:click(6);">联系我们</a></li>
    </ul>
</body>
</html>

运行结果：
图片说明