2017-05-09 16 views
0

我目前正在使用此代码的中心列作为我的内容。Bootstrap - 正确的行属性用于居中的框

<div class="row "> 

     <div class="col-md-3"> 
     </div> 


     <div class="col-md-6"> 
      <h3> 
       <a href="#">Title</a> 

      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam viverra euismod odio, gravida pellentesque urna varius vitae.</p> 
     </div> 


     <div class="col-md-3"> 
     </div> 


    </div> 

两个<div class="col-md-3">元件仅仅放在那里所以<div class="col-md-6">内容被居中。有没有另外一种方法让我有一个中心框没有两个额外的空元素。我假设有一个我可以使用的行属性或其他方法。

赞赏一个小例子。 谢谢

回答

0

取自文档:将.row-centered添加到该行,并将.col-centered添加到列。

<div class="container"> 
    <div class="row row-centered"> 
     <div class="col-xs-6 col-centered"></div> 
     <div class="col-xs-6 col-centered"></div> 
     <div class="col-xs-3 col-centered"></div> 
     <div class="col-xs-3 col-centered"></div> 
     <div class="col-xs-3 col-centered"></div> 
    </div> 
</div> 
+0

没有这样的类是引导 – ZimSystem

1

的另一种方法是使用偏移......

<div class="container"> 
    <div class="row"> 
     <div class="col-xs-6 col-xs-offset-3"></div> 
     <div class="col-xs-3"></div> 
    </div> 
</div> 

演示:http://codeply.com/go/HV3yrjxKtB