Question

我在标题和内容div之间添加了导航栏。但是导航栏和下面的内容div之间有一个大约20px的空白空间。 Navbar正在工作，滚动时它会粘到顶部，但在不滚动页面时会有白色间隙。另一个问题是导航栏的颜色，它们不会改变（字体或背景）。

<div id="header" class="container-fluid text-center" >
<h1>Title</h1>
<div class="row">
  <div class="col-sm-6 pull-right bottom">
    <p>"Text"</p>
    <p>text</p>
  </div>
</div>
</div>

<nav class="navbar navbar-inverse" data-spy="affix" data-offset-top="659">
<div class="container-fluid">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">HOME</a></li>
    <li><a href="#">something</a></li>
    <li><a href="#">something</a></li>
    <li><a href="#">something</a></li>
    <li class="dropdown">
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">MORE
      <span class="caret"></span>
      </a>
      <ul class="dropdown-menu">
        <li><a href="#">Merchandise</a></li>
        <li><a href="#">Extras</a></li>
        <li><a href="#">Media</a></li>
      </ul>
    </li>
  </ul>
 </div>
</nav>

<div class="wrap">
  <div class="container text-center">
    <h2>About</h2>
      <div class="row2">
        <div class="col-sm-12">
          <p>some text</p>
        </div>

CSS

.navbar {
   border-radius: 0 !important;
   -moz-border-radius: 0 !important;
   position: fixed;
   top: 0;
   width: 100%;
   margin-bottom: 0;/*not working*/
   padding-bottom: 0;/*not working*/
 }

.wrap {
   background-color: #000;
   margin-top: 0;/*not working*/
   padding-top: 0;/*not working*/
 }

Answer 1

尝试添加“margin-top：-18px;” “.wrap”。

Answer 2

通过添加＆＃39;！important＆＃39;解决导航栏颜色问题为代码着色。

固定导航栏和下面的内容之间的空白空间

2 个答案: