- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在制作一个 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/
抖音开学季完成任务免费领甜筒、汉堡、随机红包等 打开抖音APP 首页搜索【开学季】下拉页面点击活动进去 完成简单任务即可免费领麦当劳甜筒、吉士汉堡、随机红包等! 活动地址:抖音搜索【开学季
我有一个用于桌面 View 的导航栏和用于移动设备的汉堡菜单,我有一个关于汉堡菜单的问题;汉堡菜单的栏覆盖了部分背景图像,我希望背景图像始终位于汉堡菜单之后。这是我的代码
我想改变抽屉导航的汉堡/箭头图标的颜色。我知道我可以在样式中更改它,但我想在 java 中动态更改它。有人知道怎么做吗? 最佳答案 使用 appcompat-v7:23.0.1 下一个代码对我有用:
我正在使用带有 DrawerLayout 的工具栏。我的工具栏有 2 个 View (按钮),一个在中间,一个靠近右边距。当我使用 getSupportActionBar().setDisplayHo
我正在练习如何制作一个响应式汉堡菜单,但我在两个功能上遇到了麻烦,我想让它发挥作用。 我在汉堡菜单中使用了一个很棒的字体图标,它不想在屏幕大于 480 像素时消失。我得到那个工作的唯一方法是在图标类上
我有一个“移动汉堡包”引导菜单(引导3)。我想关闭使用代码打开的汉堡菜单。 最佳答案 Bytec0de是正确的:$('elem').collapse('hide'); 关于javascript - b
我确定有人问过这个问题,但我似乎找不到不使用 SASS 的示例。我只有一个正在使用的常规 CSS 文件。我希望汉堡菜单更改为较大尺寸的水平菜单。(@media only screen and (min
很长一段时间以来,我一直在我的网站上使用汉堡菜单,这是一个具有绝对定位的全屏导航覆盖层,其中导航打开是(css)高度= 100%并且关闭=“0%”。它基于本教程:https://www.w3schoo
我是一名优秀的程序员,十分优秀!