Navbar 和 Jumbotron 之间的差距

Question

Navbar 和 Jumbotron 之间的差距

我正在构建我想你可以为我将要构建的网站调用一个模板，但是我对引导程序仍然很陌生，因此无法确定哪些 CSS 规则正在影响元素等。

我遇到的问题是我无法让 Jumbotron 装置与导航栏底部齐平。我在这里发现了一些关于同一问题的问题，但解决方案不起作用。

这是我的代码

    </head>

  <body>

    <div class="row">
    <div>

    <img src="http://placehold.it/1600x300" width="100%">

    </div>

    <!-- Static navbar -->
    <div class="navbar navbar-default navbar-static-top" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="navbar-collapse collapse">
        <ul class="nav nav-justified" id="myNav">

            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
            <li><a href="#contact">Services</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div>

    <div class="jumbotron" id="openingtext">
        This is where the opening sale text will go
    </div>

    <div class="container">
      <!-- Example row of columns -->
      <div class="row">
        <div class="col-md-4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
        </div>
        <div class="col-md-4">
          <h2>Heading</h2>

Run Code Online (Sandbox Code Playgroud)

我会提供 css，但因为它都是从一个未更改的 bootstrap 版本中提取出来的，我的 stylesheet.css 与这些 id 中的任何一个都没有任何关系，所以这样做似乎毫无意义。

我期待听到你们的解决方案男孩和女孩

Answer 1

nol*_*awi 5

.navbar { margin-bottom:0px;}如果不想在导航底部留出边距，请添加此 css 。

归档时间：	11 年，5 月前
查看次数：	2085 次
最近记录：	11 年，3 月前