如何使用Twitter Bootstrap获得中心内容？

2018-06-03 23:51:06

我试图遵循一个非常基本的例子。使用起始页面和网格系统，我希望以下内容：

<div class="row">
  <div class="span12">
    <h1>Bootstrap starter template</h1>
    <p>Example text.</p>
  </div>
</div>

这是针对文本居中（这是问题所在）

对于其他类型的内容，请参阅Flavien的答案。

更新：Bootstrap 2.3.0+答案

最初的答案是针对bootstrap的早期版本。至于bootstrap 2.3.0， 你可以简单地给div class .text-center 。

原答复（2.3.0之前）

您需要使用text-align: center定义两个类中的一个，即row或span12 。请参阅http://jsfiddle.net/xKSUH/或http://jsfiddle.net/xKSUH/1/

注：这在Bootstrap 3中被删除。

在Bootstrap 3之前，你可以像这样使用CSS class pagination-centered ：

<div class="span12 pagination-centered">
    Centered content.
</div>

pagination-centered类已经在bootstrap.css（或bootstrap.min.css）中，并且只有一个规则：

.pagination-centered{text-align:center;}

使用Bootstrap 2.3.0。 只使用班级text-center

我猜这里的大多数人实际上是在寻找以整个div为中心的方式，而不仅仅是文本内容（这是微不足道的......）。

第二种方式（而不是使用text-align：center）将事件放入HTML中，是让元素具有固定宽度和自动边距（左侧和右侧）。使用Bootstrap，定义自动边距的样式是“容器”类。

<div class="container">
    <div class="span12">
        "Centered stuff there"
    </div>
</div>

看看这里的小提琴：http://jsfiddle.net/D2RLR/7788/

链接地址: http://www.djcxy.com/p/13243.html