Question

目前我正在建立一个以typo3为CMS的网站，对于响应式设计，我使用twitter bootstrap。现在我尝试在一行中创建4个相等的列，如此站点中的示例：http://getbootstrap.com/2.3.2/examples/hero.html

一行中有3列，我正在查看源代码，他们使用行标记，然后他们放置了span标记，我按照这些并得到不同的结果，如下所示：

http://i41.tinypic.com/2lu2hy0.png

我的代码：

<div class="container">

      <!-- Main hero unit for a primary marketing message or call to action -->
      <div class="hero-unit">
        <h1>Hello, world!</h1>
        <p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
        <p><a href="#" class="btn btn-primary btn-large">Learn more &raquo;</a></p>
      </div>

      <!-- Example row of columns -->
      <div class="row">
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
        </div>
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
       </div>
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
        </div>
      </div>
    </div>

Answer 1

行。现在我已经看过bhootstrap一侧，特别注意这个例子。我非常确定我发布的布局是用col-lg做的，但现在他们用span做了。好吧，我正在查看我的bootstrap css并且看一下，昨天的css包括了col和css，从片刻开始就有了跨度。最终：我采用了col的解决方案，我看到有另一个col，名称是“col-3”，定义为25％，这对我的问题很完美。

一行中的4个相等列无法正常工作

1 个答案: