我正在使用我以前构建的网站的框架作为构建实际网站的任务的一部分。但是,当我复制所有代码时,我的导航看起来与我完成任务时的导航不一样。
这是代码,您可以在 192.241.215.180 查看它的实例
导航应该是“药丸”,它们应该穿过,而不是堆叠起来。
<head>
<link href="/css/bootstrap.min.css" rel="stylesheet"/>
<link href="/css/bootstrap-theme.min.css" rel="stylesheet"/>
<link href="/css/styles.css" rel="stylesheet"/>
<title>C$50 Finance: Portfolio</title>
<script src="/js/jquery-1.10.2.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/scripts.js"></script>
</head>
<body>
<div class="container">
<div id="top">
<a href="/"><img alt="C$50 Finance" src="/img/logo.gif"/></a>
</div>
<div class="navbar nav-pills" role="navigation">
<div class="navbar-inner">
<div class="container">
<ul class="nav navbar-nav">
<li><a href="/index.php">Home</a></li>
<li><a href="/buy.php">Buy</a></li>
<li><a href="/sell.php">Sell</a></li>
<li><a href="/quote.php">Quote</a></li>
<li><a href="/history.php">History</a></li>
<li><a href="/changepassword.php">Change Password</a><li>
</ul>
</div>
</div>
</div>
<div id="middle">
</div>
<div id="bottom">
Copyright © John Harvard
</div>
</div>
</body>
最佳答案
你有几个问题。首先,您的标记不正确,如果您想要药片,则需要为 <ul>
使用 nav-pills 类元素,像这样:
<ul class="nav nav-pills">
虽然这应该足够了,但仅此一点不会做任何事情,因为您有一个错误的 CSS 文件和一个错误的 JQuery 文件。我不知道你是怎么做到的,但这就是你得到的。因此,不要使用您的文件,而是尝试使用 CDN 版本,如下所示:
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
和
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
测试它们,看看它们如何为您工作,但我相信这会解决您的问题
关于html - 无法让 Bootstrap 导航正确显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25696974/