移动菜单显示在导航栏内而不是下方

时间:2015-02-26 13:48:22

标签: html twitter-bootstrap navbar

每当我点击栏图标时,菜单会在导航栏中弹出,而不是在导航栏下方。我该如何纠正?

<!DOCTYPE HTML>
    <HTML lang="en">
    <HEAD>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.css">
        <link rel="stylesheet" type="text/css" href="css/styles.css"> 

    </style> 

    <HEAD>
    <BODY>
     <div class="navbar navbar-inverse navbar-static-top">

            <div class="container">
            <a href="#" class="navbar-brand">Portfolio</a>
            <button  type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navHeadercollapse"> 
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
                <div class="collapse navbar-collapse navHeadercollapse">

                    <ul class="nav navbar-nav navbar-right">

                        <li class="active"><a href="#">home</a></li>
                        <li><a href="#">social</a></li>
                        <li><a href="#">contact us</a></li>
                        <li><a href="#">about us</a></li>

                    </ul>


                </div>

            </div>

     </div>

    <script src = "jquery/jquery-2.1.3.min.js"></script>
    <script src="js/bootstrap.js"></script>

    </BODY>

    </HTML>
![enter image description here][1]

0 个答案:

没有答案