gpt4 book ai didi

jquery - Bootstrap 崩溃不起作用;汉堡菜单不显示

转载 作者:行者123 更新时间:2023-12-01 06:18:55 24 4
gpt4 key购买 nike

我正在制作一个 Angular 应用程序,并使用 Bower 安装了所有库。当我检查控制台时,所有工作表/脚本都已正确加载。我的头脑中还定义了 bootstrap 和 jQuery。我从 Bootstrap 网站复制了代码。

我遇到的问题是汉堡菜单永远不会出现。链接与屏幕大时完全相同。另一个问题是,即使网站很大,导航折叠折叠 div 中也不会显示任何内容。似乎存在崩溃问题,这使得两者都不起作用。有建议吗?

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jay - Web Developer</title>

<!-- For Angular Routing -->
<base href='/'>

<!-- CSS -->
<link rel="stylesheet" href="assets/libs/bootstrap/dist/css/bootstrap.min.css">

<!-- JS -->
<script src="assets/libs/angular/angular.min.js"></script>
<script src="assets/libs/angular-route/angular-route.min.js"></script>
<script src="assets/libs/angular-animate/angular-animate.min.js"></script>
<script src="assets/libs/jquery/dist/jquery.min.js"></script>
<script src="assets/libs/bootstrap/dist/js/bootstrap.js"></script>

<!-- APP -->
<script src="app/controllers/mainCtrl.js"></script>
<script src="app/app.routes.js"></script>
<script src="app/app.js"></script>
</head>

<body ng-app="jayPortfolio" ng-controller="mainController as main">

<!-- NAVBAR -->
<header>
<div class="navbar navbar-default">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar">About</span>
<span class="icon-bar">Portfolio</span>
<span class="icon-bar">Experience</span>
<span class="icon-bar">Contact</span>
</a>

<a class="brand" href="#">JAY</a>

<div class="nav-collapse collapse">
work please
</div>

</div>
</div>
</div>
</header>
</body>

</html>

最佳答案

您的导航栏标记不正确。标记应如下所示:

<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Huisje Thuisje</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#contact">Contact</a></li>
<!-- Put here your menu items -->
</ul>

</div --><!--/.navbar-collapse -->
</div>
</nav>

ul 元素中,放置菜单项。这应该够了吧。另请参阅documentation page .

关于jquery - Bootstrap 崩溃不起作用;汉堡菜单不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32081497/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com