更改Bootstrap 2.0.4响应式导航栏宽度

Question

我正在使用Twitter Bootstrap 2.0.4 +引导响应.css创建网站。 我不知道的是：是否可以在网站的左上方显示徽标，并在徽标的右侧显示导航栏（但固定在顶部）？ 更改大小时，徽标应随后出现在导航栏的顶部。

真的很高兴得到答案，因为我还没有找到任何帮助。

问候，多米尼克

编辑：这是描述我想要实现的图片： http : //i.imgur.com/HX3ZM.png

徽标在左侧，然后是导航栏。

Answer 1

知道了 我使用了固定的导航栏，该导航栏无法正常工作。 您必须使用静态导航栏。 然后，您可以只使用引导程序中的行/脚手架系统。

导航栏左侧徽标的示例代码：

   <div class="row-fluid">
    <div class="span3">
      <p><img src="/sites/img/your_logo.png" alt="Logo" class="responsive-logo"></p>
    </div>
    <div class="span9">
      <div class="navbar">
        <div class="navbar-inner">
          <div class="container">
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </a>
            <div class="btn-group pull-right">
              <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                <i class="icon-user"></i> Username
                <span class="caret"></span>
              </a>
              <ul class="dropdown-menu">
                <li><a href="#">Profile</a></li>
                <li class="divider"></li>
                <li><a href="#">Sign Out</a></li>
              </ul>
            </div>
            <div class="nav-collapse">
              <ul class="nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#about">About</a></li>
                <li><a href="#contact">Contact</a></li>
              </ul>
            </div>
          </div>
        </div>
      </div><!-- end navbar -->
    </div><!-- end span8 -->
  </div><!-- end row -->

为了使徽标具有响应性，我添加了以下css规则：

  .responsive-logo {
max-width: 100%;
height: auto;
border: 0;
padding-top: 10px;

}

Answer 2

是的，当然可以。您需要重新组织文档，以将（例如）div和span4类放置在导航栏上方。

在其下，具有导航栏代码并删除品牌元素（通常带有徽标）。 我的假设使我相信您想要这样的东西：

如果您可以更具体地了解您想要的东西，和/或提供网站的相关部分（HTML），我可能会给出更多的指导。