我想用一个非常基本的例子。使用入门页面和网格系统，我希望如下:
< div class = "行" > < div class = " span12”> <h1>引导启动器模板</h1> < / p > < p >示例文本。 < / div > < / div >
.．.会产生居中的文本。
然而，它仍然出现在最左边。我做错了什么?
当前回答
<div class="container">
<div class="col-md-12 centered">
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-10">
label
</div>
<div class="col-md-1"></div>
</div>
</div>
</div>
不要主要使用容器流体。
其他回答
类.show-grid在链接中的示例中应用居中对齐的文本。
你总是可以添加style="text-align:center"到你的行div或其他类，我想。
我尝试了两种方法，它的工作很好，以中心的div。这两种方法都将对齐div在所有屏幕上。
方法1:使用Push:
<div class = "col-lg-4 col-md-4 col-sm-4 col-xs-4 col-lg-push-4 col-md-push-4 col-sm-push-4 col-xs-push-4" style="border-style:solid;border-width:1px">
<h2>Grievance form</h2> <!-- To center this text, use style="text-align: center" -->
</div>
方法2:使用偏移量:
<div class = "col-lg-4 col-md-4 col-sm-4 col-xs-4 col-lg-offset-4 col-md-offest-4 col-sm-offest-4 col-xs-offest-4" style="border-style:solid;border-width:1px">
<h2>Grievance form</h2> <!--to center this text, use style="text-align: center"-->
</div>
结果:
解释
Bootstrap将指定左边，指定屏幕占用的第一列。如果我们使用offset或push，它会将“this”列移动“that”列。虽然我遇到了一些问题，在响应补偿，推动是了不起的。
对于Bootstrap 3.1.1及以上版本，用于使内容居中的最佳类是.center-block helper类。
在保持响应性(移动兼容性)的同时，我更喜欢将信息块居中的方法是在您希望居中的内容之前和之后放置两个空span1 div。
<div class="row-fluid">
<div class="span1">
</div>
<div class="span10">
<div class="hero-unit">
<h1>Reading Resources</h1>
<p>Read here...</p>
</div>
</div><!--/span-->
<div class="span1">
</div>
</div><!--/row-->
如果你使用Bootstrap 2.0+
这可以使div居中于页面。
<div class="row">
<div class="span4 offset4">
//your content here gets centered of the page
</div>
</div>
