html - 导航栏崩溃在 Bootstrap 中不起作用

标签 html css twitter-bootstrap

尝试开始学习 Bootstrap。我创建了很少的代码来创建响应式菜单,就像这样

<head>
    <meta charset="UTF-8">
    <title>Bootstrap</title>
    <link rel="stylesheet" type="text/css" href="CSS/bootstrap.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a href="#" class="navbar-brand">Application Name</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Home</a></li>
                </ul>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="JS/bootstrap.js"></script>
</body>
</html>

我的问题是,为什么当我尝试在小型浏览器中选择菜单时,菜单没有显示? 有人可以告诉我为什么吗? 谢谢

最佳答案

我猜你没有加载 jQuery。把这个放在你的标题中,看看它是否有效:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

我还建议在 header 中加载 bootstrap js 文件,就在 jQuery 库之后。

关于html - 导航栏崩溃在 Bootstrap 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20537743/

相关文章:

javascript - 如何在我的计算器中存储结果和查看以前的计算结果?

javascript - 更改动态创建的选择框 JQuery 中的选项

css - 关键帧动画未运行 - 缺少什么?

javascript - 使用 Javascript/jQuery 根据文本值修改 CSS

css - 根据高度和宽度之间的最大值更改背景图像尺寸

html - 当填充文本时,WebKit 会减小表格单元格的大小

JQuery 移动面板样式 : data-display ="reveal" not working properly

javascript - 添加 onclick 函数到我的表的每一行只记录最后一行

html - 如何拥有类似于 Twitter Bootstrap 网站上的导航栏

css - 如何在纯 CSS 中创建带有位于圆心的文本的圆形动画?