Question

所以我有这个代码（数据切换和数据目标在我的n ++中是黑色的，我也使用数据目标而不是数据目标，它显示我的红色......）

我想让我的网页对移动用户和大型桌面用户做出响应。但当我放大显示屏时，右上角有一个按钮，可以打开下拉菜单，但它没有。

<html>
<head>
    <title>Built your Website</title>
    <meta charset="UTF-8">  

    <link rel="stylesheet" href="style.css">

     <!--jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

</head>


<nav>

    <nav class="navbar navbar-default navbar-static-top"> <!-- color, statisch-->
        <div class="container">

                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data target=".navbar-collapse "> <!-- button, navbar mit dropmenu wenn bildschirm zu klein-->

                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span> <!-- creates 3 lines in the toggle navigation when screen too little -->
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>

                    </button>

                <a class="navbar-brand" href="index.php">TAIL
                <!-- <span class="glyphicon glyphicon-home" id="homeIcon"></span> -->
                </a>

                </div>



                    <div class="navbar-collapse collapse">
                        <ul class="nav navbar-nav navbar-left">
                            <!--<li><a class="navbar-brand" href="index.php">TAIL</a></li>-->
                            <li class="dropdown"> <a href="templates.php" class="dropdown-toggle" data-toggle="dropdown" >Templates</a></li> 
                            <li class="dropdown"> <a href="pricing.php" class="dropdown-toggle" data-toggle="dropdown" >Pricing</a></li>
                        </ul>

                        <ul class="nav navbar-nav navbar-right">
                            <li class="dropdown"> 
                                <a href="register.php" class="dropdown-toggle" data-toggle="dropdown" >Sign Up
                                <span class="glyphicon glyphicon-user" id="sserIcon"></span>
                                </a>
                            </li>

                            <li class="dropdown"> 
                                <a href="login.php" class="dropdown-toggle" data-toggle="dropdown" >Log In 
                                <span class="glyphicon glyphicon-log-in" id="logIcon"></span>
                                </a>
                            </li>
                        </ul>   

                    </div>
        </div>          
    </nav>

Answer 1

您的代码中缺少短划线。而不是：

data target=".navbar-collapse "

这样做：

data-target=".navbar-collapse "

然后它有效。

为什么没有Bootstrap-data-toggle工作？

1 个答案: