在CSS3和Bootstrap中只改变nav特性的宽度特性
在CSS3和Bootstrap中只改变nav特性的宽度特性
提问于 2014-04-10 02:43:33
我的HTML文件如下所示：
<body>
<div class="container">
<header>
<nav class="nav navbar-default">
</nav>
</header>
//main contents here
</div>
</body>所以，我的HTML只有一个.container，其中包括.nav和主要内容。
并在CSS3 {width: 99%;} on .container上设置以下属性。
然而，当我打开它在浏览器上，不仅做的主要内容，而且导航被缩小了1%，由于上述设置。我想知道的是，除了导航之外，我怎样才能使container缩小1%？
我使用Stylus，并尝试编写以下代码：
.container
header
width: 100%，但这是不起作用的，结果仍然是99%的窗口。
我还试图编写&header来引用父.container，但是结果仍然是一样的.为什么？
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-04-10 04:05:41
你应该反过来做，就像.
<nav class="nav navbar-default">
<div class="container">
//content
</div>
</nav>这样，您的<nav>就不会受到宽度变化的影响，并且所有的内部内容都会受到影响。
如果你真的需要按照你的结构.做以下事情：
<div class="container">
<header>
<nav class="nav navbar-default">
<div class="container container-width">
//content
</div>
</nav>
</header>
</div>
.container-width {
width: 99%;
}这样，您不会全面修改引导网格结构(这会给您带来许多麻烦)，而是将自定义宽度应用到您的一个元素(因为它是一个类，您也可以将这个类添加到任何其他容器中来修改它)。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22977728
复制相关文章
相似问题
腾讯云开发者
