1

我试图弄清楚为什么我的引导程序中的滚动间谍不起作用。我发现部分标签是堆叠的,并且不能与它们的子元素一起正常工作。

Chromes计算样式(连同其他浏览器)如下:

background-color: transparent;
color: #333;
display: block;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 13px;
height: 0px;
line-height: 18px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
width: 940px;

但是其中的数据<section>计算为:

background-color: transparent;
color: #333;
display: block;
float: left;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 13px;
height: 317px;
line-height: 18px;
margin-bottom: 0px;
margin-left: 20px;
margin-right: 0px;
margin-top: 0px;
width: 780px;

如果我注释掉 bootstrap.css (我没有编辑过),这些部分就是它们应该的样子。bootstrap 做的唯一事情是它设置sectionblock.

我想知道我的 HTML 是否会导致问题。我的页面布局是:

<body>
<div class="container">
    <header>
        <h1>HEADER</h1>
        <nav>
          <div class="subnav">
            <ul class="nav nav-pills">
              <li><a href="#overview">Introduction</a></li>
              <li><a href="#begin">The Beginning</a></li>
                  ...
            </ul>
          </div>
      </nav>
    </header>
    <section id="overview">
      <div class="span10">
        <h2>Introduction</h2>
        <hr class="full">
        <p> text text text text </p>
      </div>
    </section>
    <section id="begin">
      <div class="span10">
        <h2>The Beginning</h2>
        <hr class="full">
        <p> text text text text </p>
      </div>
    </section>
    ...
  </div>
  <script>..</script>
</body>

所有部分仅以 1px 的间距相互堆叠。bootstrap.css 是什么导致了这个问题。这个还是我的布局?我已经用 javascript 样式编辑了每个变量,它直接指向 bootstrap.css。请帮我。

更新

我写了一个简单的页面,但它仍然不能<section>正确计算标签。

4

2 回答 2

4

答案很简单,但我花了几个小时才弄清楚。

对于<section>您需要在指定<div class="row">之前指定<div class="span'somenumber'>的每个标签,并且部分标签将正确计算。

于 2012-04-26T01:01:53.673 回答
1

可能尝试<section id="overview" class="row">

于 2012-12-17T21:07:24.603 回答