导航下拉菜单代码 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title></title>
        <style type="text/css">
            #nav{
                width: 80%;
                height: 100px;
                /*border: 8px solid red;*/
                margin: 0px auto;
                margin: 上 右 下 左;
                /*overflow: scroll;*/
            }
            .nav-banner{
                /*border: 4px solid black;*/
                text-align: center;
                line-height: 100px;
                width: 20%;
                height: 100px;
                float: left;
                position: relative;
            }
            .nav-banner:hover{
                background-color: #000000;
                color: white;
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <div id="nav">
            <div class="nav-banner">第1导航</div>
            <div class="nav-banner">第2导航</div>
            <div class="nav-banner">第3导航</div>
            <div class="nav-banner">第4导航</div>
            <div class="nav-banner">第5导航</div>
        </div>
    </body>
</html>

 

posted @ 2016-12-23 18:14  周全264  阅读(260)  评论(0)  编辑  收藏  举报