制作下拉菜单

1.HTML部分

    
    
    
    


     

        

            微博
            

                

                    私信
                
                

                    评论
                
                

                    @我
                
            
        
        

            博客
            

                

                    博客评论
                
                

                    未读提醒
                
            
        
        

            邮箱
            

                

                    免费邮箱
                
                

                    VIP邮箱
                
                

                    企业邮箱
                
                

                    新浪邮箱
                
            
        
    

2.css部分

        * {
            padding: 0;
            margin: 0;
        }
        
        li {
            list-style: none;
        }
        
        a {
            text-decoration: none;
            font-size: 14px;
        }
        
        .nav {
            margin: 200px;
        }
        
        .nav>li {
            float: left;
            width: 80px;
            height: 40px;
            text-align: center;
        }
        
        .nav li a {
            display: block;
            width: 80px;
            height: 40px;
            line-height: 40px;
            border: 1px solid red;
        }
        
        .bg {
            background-color: pink;
        }
        
        .nav ul li a:hover {
            background-color: orange;
        }
        
        .nav ul {
            display: none;
        }
        
        .bg {
            background-color: pink;
            color: #fff;
        }
    

3.javascript部分