Center Thumbnail Button Bootstrap

Question

我正在使用最新版本的bootstrap，但我似乎無法弄清楚如何將按鈕置於下面的一段代碼中。我只想要這個特定的縮略圖，而不是全局的，所以我不能改變CSS。

<div class="row"> 
    <ul class="thumbnails"> 
    <li class="span4"> 
     <div class="thumbnail"> 
     <img src="http://placehold.it/400x200" alt=""> 
     <h3>Need A Price?</h3> 
     <p>Fill in the Quote form and get a price within 30mins,We know you dont like waiting around</p> 
      <div class="btn-group"> 
      <button class="btn btn-primary">Get A Quote</button> 
      </div> 
     </div> 
    </li> 
</ul> 
</div> 

Answer 1

如果你只希望居中的一個按鈕，然後就可以利用該.btn-group容器，只是針對該元素與你自己的類，這樣你可以定義面積display: block，只是居中對齊按鈕像這樣：

CSS

.btn-centered { 
    text-align: center; 
    display: block; 
} 

HTML注意一下的的容器上使用的類.btn-group。

<div class="row"> 
    <ul class="thumbnails"> 
    <li class="span4"> 
     <div class="thumbnail"> 
     <img src="http://placehold.it/400x200" alt=""> 
     <h3>Need A Price?</h3> 
     <p>Fill in the Quote form and get a price within 30mins,We know you dont like waiting around</p> 
      <div class="btn-group btn-centered"> 
      <button class="btn btn-primary">Get A Quote</button> 
      </div> 
     </div> 
    </li> 
</ul> 
</div> 

演示：http://jsbin.com/ubiwip/2

Answer 2

這似乎爲我工作：

<p align="center"><a href="#" class="btn btn-primary btn-block">TEST</a></p>