[英]Remove space between navbar and header
我在引导导航栏下面有一个奇怪的边距,而且我不知道如何删除它。 任何带边距或填充操作的解决方案都不起作用。
HTML
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<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="#"><span class="glyphicon glyphicon-home"></span></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Active example <span class="sr-only">(current)</span></a></li>
<li><a href="#">Example 3</a></li>
<li><a href="#">Example 2</a> </li>
</ul>
</div>
</div>
</nav>
<!-- HEADER -->
<div class="container-fluid" style="margin-top: -20px; margin-bottom: 25px;">
<div class="row">
<img src="http://thehrblog.ecornell.com/wp-content/uploads/sites/2/2013/04/communication.png" class="img-responsive">
</div>
</div>
CSS
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
background-color: #007DBE;
color: #FFF;
}
示例如下: Jsfiddle (如果隐藏了导航栏中的菜单,请调整“结果”大小)。
我需要删除此空间:
忘掉这个:
navbar.less
文件正在导航栏上添加border
:
.navbar-fixed-top {
top: 0;
border-width: 0 0 1px;
}
所以你可以用它来重置:
.navbar-fixed-top {
border:0;
}
更改
.navbar-fixed-top {
border-width: 0 0 1px;
top: 0;
}
至
.navbar-fixed-top {
border-width: 0;
top: 0;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.