【发布时间】:2014-02-05 01:18:35
【问题描述】:
我在不同的 div 中有一个菜单和一个子菜单。他们之间有一个空间。我怎样才能让它们看起来像一个完整的菜单?我将引导导航栏用于主菜单,将简单导航用于子菜单。我是css的新手。这就是我所拥有的:
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<a class="brand" href="#">Website Logo</a>
<ul class="nav">
<li class="active"><a href="#">DashBoard</a></li>
<li><a href="#">Docs</a></li>
<li class="dropdown"> <a class="dropdown-toggle" data-toggle="dropdown" href="#">Account<b class="caret"></b></a>
<ul class="dropdown-menu" style="width: 250px;">
<li><a href="#">Dashboard</a></li>
<li><a href="#">LogOut</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div>
<ul class="nav nav-pills">
<li class="active">
<a href="#">Stats</a>
</li>
<li><a href="#">Api Calls</a></li>
<li><a href="#">Settings</a></li>
</ul>
</div>
jsfiddle
我只想删除它们之间的空间。
还有一个小问题:
我怎样才能摆脱按钮和它的下拉之间的小插入符号? (帐户导航项与其下拉列表之间的白色三角形)
【问题讨论】:
-
@Kevin Bowersox 在下面说了什么。另外,将其添加到您的 CSS 文件中应该可以消除小三角形:
.navbar .nav>li>.dropdown-menu:after { display: none !important; }
标签: html css twitter-bootstrap