0

我使用 Twitter Bootstrap 设计了一个完整的网站,它在大多数情况下都运行良好。我过去做过很多 CSS,但从来没有做过这样的框架。

我遇到的主要问题是,当浏览器低于 600 像素并且标题压缩成一个下拉列表(我想要的)时,下拉列表位于图像和一些 HTML 元素(如文本输入框和其他下拉菜单)后面。

有没有办法使这个标题下拉菜单不透明,以便它位于所有其他元素的前面?我会提供一些代码,但我不确定 Twitter Bootstrap 样式表的哪一部分会有所帮助。

<div class="navbar navbar-fixed-top">

              <div class="navbar-inner">

                  <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>

                  <a class="brand" href="/">Exployre</a>

                  <div class="nav-collapse">

                    <ul class="nav">

                      <li><a href="/map">Find</a></li>

                      <li><a href="/shareadventure">Share</a></li>

                      <li><a href="/home">Inspire</a></li>

                      <li><a href="/posts">Discuss</a></li>

                      <li><a href="/groups">Groups</a></li>

                      <li><a href="/profile">Profile</a></li>

                      <li><a href="/about">About</a></li>

                  <li>        

                        <form action="/search" class="navbar-search">

                          <div>

                            <input type="text" placeholder="Search" class="search-query pull-right" name="q" size="55" />

                          </div>

                        </form>

                        <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script>

                      </li>



                    </ul>

                  </div><!--/.nav-collapse -->

              </div>

            </div>

我相信所有这些类都直接来自 Twitter Bootstrap CSS,无需修改。

4

1 回答 1

1

您的网站内容上的 z-index 值可能高于为下拉菜单定义的 z-index 值。

如果您使用的是 LESS 版本的 Twitter Bootstrap,请打开 variables.less 并找到包含的行@zindexDropdown(在第 144 行)。默认设置为 1000,您可以将其更改为高于内容 z-index 的数字。

如果您使用的是普通 CSS,它在规则中定义.dropdown-menu(在第 2773 行)。

于 2012-10-31T20:41:40.403 回答