html - 即使内部有列，Bootstrap 行仍会在右侧产生间隙

Question

我有一个页面，其中 container-fluid 是主 div，然后是 nav。在导航之后，我有一个部分，其中 View 加载行包装内容，这些内容分为列或偏移。但是当我在部分或之后的 div 上使用行类时，它会在导航和页面之间创建一个间隙。主要是添加到容器中。但这就是我们应该使用容器的原因。行是列的，为什么还有差距？

<div class="container-fluid ng-scope" id="page-wrapper" ng-controller="homeCtrl as ctrl">
<nav><div class="container"></div></nav>
<section>
<div ng-controller="assumeIdCtrl as ctrl" class="row ng-scope">
<div class="col-md-4 col-md-offset-4 col-sm-4 col-sm-offset-4 col-xs-6 col-xs-offset-3">
</div>
</div>
</section>

Answer 1

使用默认的bootstrap的nav，你可以从W3C复制代码。然后使您的结构正确，例如:

<nav> </nav>
<section class="container-fluid">
    <div class="row">
        <div class="col-md-6">
        </div>
        <div class="col-md-6">
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
        </div>
    </div>
</section>

检查是否有不同的容器类型。默认情况下，div、nav、aside、section、footer 等都是容器。使用 bootstrap 很好，但是我们必须记住 HTML 标签的默认属性，然后再使用 bootstrap。

尝试使用默认 Bootstrap 的固定导航。我用它做了一个投资组合的例子，你可以在这里检查和检查:

portfolio example

关于 js 非常干净(如果我没记错的话只有一个 jQ 函数)并且只有一点手工制作的 css。