Question

我正在尝试在bootstrap中创建一个宽度为100％的导航栏，但它无效。

vector2 = double(length(vector1)/10);
for( i in seq_len(length(vector2)/10000) ){
    part = vector1[((i-1)*10000+1):(i*10000)]
    dim(part) = c(10, 1000)
    vector2[((i-1)*1000+1):(i*1000)] = colSums(part)
}

Answer 1

删除容器流体中的填充，创建“custom-nav-container”类以覆盖。

    <div class="container-fluid custom-nav-container">
        <nav class="navbar navbar-inverse navbar-static-top">
            <div class="container">
                <div class="navbar-header">
                    <a class="navbar-brand" href="#"> WebsiteName </a>
                </div>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">About</a></li>
                    <li><a href="#">Portfolio</a></li>
                    <li><a href="#">Contact</a></li>
                </ul>
            </div>
        </nav>
    </div>

.custom-nav-container{
padding-left: 0px !important;
padding-right: 0px !important;
}

Answer 2

替换

<div class="container-">

要

<div class="container-fluid">

在您的代码中。你的问题解决了。谢谢。

Answer 3

.container 在bootstrap（xs，sm，md，lg）中为每个屏幕大小设置了一个固定宽度。它是响应;但是，它是根据屏幕尺寸固定的。 .container-fluid 展开以填充可用宽度。如果您使用容器流体并调整浏览器大小，您可能会注意到其中的内容将根据每个像素进行调整，以获取完整的可用宽度。

<div class="container">
    <nav class="navbar navbar-inverse navbar-static-top">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand" href="#"> WebsiteName </a>
            </div>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="#">About</a></li>
                <li><a href="#">Portfolio</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </div>
    </nav>
</div>

Navbar在bootstrap 3中不是全宽

3 个答案: