0

我是 Bootstrap 的新手，我正在尝试使用它创建一个简单的站点。我想使用缩略图创建一个包含 3 列的图片库。这是我的代码：

<div class="container-fluid">
  <div class="row-fluid">
    <header class="span12 hero-unit">
      <img src="http://placehold.it/200x100" alt="The Art Conference" class="pull-right">
      <h1>The Art Conference</h1>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
      <p><a href="#" class="btn btn-primary btn-large">Learn more</a></p>
    </header>
  </div>

  <div clas="row-fluid">
    <ul class="thumbnails">
      <li class="span4">
        <article class="thumbnail">
          <img src="http://placehold.it/200x100">
          <h3>Jennifer Jerome</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam faucibus nibh justo, ac sollicitudin dolor aliquam sit amet. Pellentesque facilisis mollis rutrum. Sed ac lectus vestibulum, lacinia justo sed, porta sapien. In euismod pulvinar condimentum. Mauris eget laoreet ante. Phasellus ultrices libero eget magna egestas, sit amet laoreet quam gravida. Duis posuere eu libero ac feugiat.</p>
        </article>
      </li>
      <li class="span4">
        <article class="thumbnail">
          <img src="http://placehold.it/200x100">
          <h3>Jonathan Ferrar</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam faucibus nibh justo, ac sollicitudin dolor aliquam sit amet. Pellentesque facilisis mollis rutrum. Sed ac lectus vestibulum, lacinia justo sed, porta sapien. In euismod pulvinar condimentum. Mauris eget laoreet ante. Phasellus ultrices libero eget magna egestas, sit amet laoreet quam gravida. Duis posuere eu libero ac feugiat.</p>
        </article>
      </li>

      <li class="span4">
        <article class="thumbnail">
          <img src="http://placehold.it/200x100">
          <h3>Levonne Larue</h3>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam faucibus nibh justo, ac sollicitudin dolor aliquam sit amet. Pellentesque facilisis mollis rutrum. Sed ac lectus vestibulum, lacinia justo sed, porta sapien. In euismod pulvinar condimentum. Mauris eget laoreet ante. Phasellus ultrices libero eget magna egestas, sit amet laoreet quam gravida. Duis posuere eu libero ac feugiat.</p>
        </article>
      </li>
    </ul>	
  </div>

在 Chrome 等浏览器上呈现时，它没有对齐。图片：http: //img835.imageshack.us/img835/6195/bootstrapproblem1.jpg

我错过了什么？。

P/s：我用的是 Bootstrap v2.3.2

4

1 回答 1

0

您的代码中有错字。尝试更改<div clas="row-fluid">为<div class="row-fluid">.

于 2013-06-09T11:31:30.173 回答