0

我在 Bootstrap RC1 中有代码:

<div class="navbar navbar-fixed-top">
    <div class="container">
    <div class="row">
        <span class="hand navbar-brand"style="font-family:'Yanone Kaffeesatz';font-size:30px">
            TITLE
        </span>
        <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#asd"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>
        <div class="nav-collapse collapse bs-navbar-collapse"id="asd">
            <ul class="nav navbar-nav">
                <li class="active"><a class="hand">Menu1Menu1</a></li>
                <li class="dropdown"id="navbarNuevo">
                    <a data-toggle="dropdown"class="dropdown-toggle hand">Menu2Menu2 <b class="caret"></b></a>
            <form class="navbar-form pull-left">
                <input type="text" class="form-control" style="width:200px;"placeholder="">
                <button class="btn btn-warning">Search <span class="glyphicon glyphicon-search"></span></button>
            </form>
        </div>
    </div>
    </div>
</div>

看起来像:

导航栏

当我调整它的大小时:

导航栏调整大小

但是当我稍微调整一下大小时,我遇到了一个问题:

导航栏问题 http://img821.imageshack.us/img821/6594/q56j.png

而且还有空位!

这是我目前遇到的最大问题。但是,一旦解决了,我需要另一个帮助。如何让导航栏始终位于屏幕中央?当导航栏折叠时没有问题并且标题居中。但正如您在第二张图片中看到的那样,标题被拉到了左边。好吧,非常感谢您至少阅读了这个问题。

4

1 回答 1

1
     <div class="container">
     <div class="row-fluid">
<div class="span10 offset1">
    <div class="navbar navbar-fixed-top">
            <span class="hand navbar-brand"style="font-family:'Yanone Kaffeesatz';font-size:30px">
                TITLE
            </span>
            <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#asd"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>
            <div class="nav-collapse collapse bs-navbar-collapse"id="asd">
                <ul class="nav navbar-nav">
                    <li class="active"><a class="hand">Menu1Menu1</a></li>
                    <li class="dropdown"id="navbarNuevo">
                        <a data-toggle="dropdown"class="dropdown-toggle hand">Menu2Menu2 <b class="caret"></b></a>
                <form class="navbar-form pull-left">
                    <input type="text" class="form-control" style="width:200px;"placeholder="">
                    <button class="btn btn-warning">Search <span class="glyphicon glyphicon-search"></span></button>
                </form>
            </div>
        </div>
        </div>
    </div>
</div>
于 2013-08-01T10:59:37.787 回答