我正在尝试使用bootstrap模板构建我的第一个网站,我无法在导航栏中显示下拉按钮以显示任何内容或打开。它将以我想要的方式显示所有内容,但由于某种原因,它的“开放”功能无法正常工作。
以下是我在HTML部分中的内容:
<li div class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle" data-
toggle="dropdown">General Education <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="gened.html">Composition</a></li>
<li><a href="#">American Institutions</a></li>
<li><a href="#">Humanities</a></li>
<li><a href="#">Physical Sciences</a></li>
<li><a href="#">Quantitative Literacy</a></li>
<li><a href="#">Fine Arts</a></li>
<li><a href="#">Interdisciplinary</a></li>
<li><a href="#">Social Sciences</a></li>
<li><a href="#">Fine Arts</a></li>
</ul>
</li>
(我还没有更新所有目标链接,现在大多数只显示为#)
并且我有CSS:
.dropdown-toggle:active,
.open .dropdown-toggle {
outline: 0;
}
请帮忙!
答案 0 :(得分:1)
代码<li class="dropdown">
出错尝试此代码
您的页面不包含必要的js文件,因此请在
脚本
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
HTML
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle" data-
toggle="dropdown">General Education <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="gened.html">Composition</a></li>
<li><a href="#">American Institutions</a></li>
<li><a href="#">Humanities</a></li>
<li><a href="#">Physical Sciences</a></li>
<li><a href="#">Quantitative Literacy</a></li>
<li><a href="#">Fine Arts</a></li>
<li><a href="#">Interdisciplinary</a></li>
<li><a href="#">Social Sciences</a></li>
<li><a href="#">Fine Arts</a></li>
</ul>
</li>
示例标记
<!-- start: User Dropdown -->
<li class="dropdown">
<a id= "uname" style="color:#fff;text-shadow:none" class="btn dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-user"></i>
Admin
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#" ><i class="icon-lock"></i> Change Password</a></li>
<li><a href="#"><i class="icon-off"></i> Logout</a></li>
</ul>
</li>
<!-- end: User Dropdown -->