css – Twitter Bootstrap – 全宽导航栏

前端之家收集整理的这篇文章主要介绍了css – Twitter Bootstrap – 全宽导航栏前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
按照TB的例子,我有一个导航栏标记如下:
<div class="container">
    <div class="navbar">
        <div class="navbar-inner">
                   <!-- nav bar items here -->
        </div>
    </div>
</div>

我想要这样做跨越屏幕的整个宽度,没有任何圆角 – 类似于导航栏的静态顶部样式。

在TB中似乎找不到如何做到这一点。如果没有办法,我需要什么CSS来覆盖TB,而不是破坏响应?

解决方法

不知道navbar-static-top类是否在版本2.2.2之前可用,但我认为您可以通过以下方式实现您的目标:
<div class="navbar navbar-static-top">
    <div class="navbar-inner">
        <ul class="nav">
            <li class="active"><a href="#">Test1</a></li>
            <li><a href="#">Test2</a></li>
            <li><a href="#">Test3</a></li>
            <li><a href="#">Test4</a></li>
            <li><a href="#">Test5</a></li>
        </ul>
    </div>
</div>
<div class="container">
    ...
</div>

我整理了一个jsFiddle as an example

猜你在找的CSS相关文章