Question

这是我的导航栏。

<div class="navbar navbar-default">
  <div class="container-fluid">

    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" id="Logo" href="/">xxxx</a>
    </div>

    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav navbar">
        <li class="active"><a href="#">Home</a>
        </li>
        <li><a href="#">Blog</a>
        </li>
        <li><a href="www.pinkman-translations.com/Sprachen">Sprachen</a>
        </li>
        <li><a href="#">Kontakt</a>
        </li>
      </ul>

      <ul class="nav navbar-nav navbar-right">
        <li><a href="xxxx"><i class="fa fa-phone fa-lg"></i>xxxx</a>
        </li>
      </ul>
    </div>

  </div>
</div>

在此之后，我设置了一个Section，但问题出在Navbar和Section之间有一些空白区域。我希望该部分在Navbar之后立即开始，或者甚至更好的Navbar从该部分的顶部开始。任何想法？

Answer 1

Bootstrap的redis-server组件的默认底部边距为20px。您可以通过在样式表中添加以下CSS来消除此问题。

.navbar

我建议您同时审核Bootstrap's Navbar Documentation，因为.navbar.navbar-default { margin-bottom: 0; } .navbar中的无序列表中有一个重复的.navbar-collapse课程。

我的Navbar后有空格？如何删除它？

1 个答案: