你如何得到中心内容使用Twitter引导?

我想用一个非常基本的例子。使用入门页面和网格系统，我希望如下:

< div class = "行" > < div class = " span12”> <h1>引导启动器模板</h1> < / p > < p >示例文本。 < / div > < / div >

.．.会产生居中的文本。

然而，它仍然出现在最左边。我做错了什么?

当前回答

对于Bootstrap 3.1.1及以上版本，用于使内容居中的最佳类是.center-block helper类。

其他回答

任何文本对齐实用程序类都可以做到这一点。Bootstrap使用.text-center类来居中文本已经有很长一段时间了。

.text-center { text-align: center !important; }

或者您可以创建自己的实用程序。这些年来我看到的一些变化:

.u-text-center { text-align: center !important; }
.ta-center { text-align: center !important; }
.ta\:c { text-align: center !important; }

如果你使用Bootstrap 2.0+

这可以使div居中于页面。

<div class="row">
    <div class="span4 offset4">
        //your content here gets centered of the page
    </div>
</div>

我创建了这个类来保持居中，无论屏幕大小，同时保持响应功能:

.container {
    alignment-adjust: central;
}

中心块也是一个选项没有提到以上的答案

    <div class="center-block" style="width:200px;background-color:#ccc;">...</div>

类center-block所做的就是告诉元素的边距为0 auto, auto是左/右边距。但是，除非类text-center或css text-align:center;在父元素上设置时，元素不知道从哪个点进行自动计算，因此它不会像预期的那样居中。

所以文本中心是一个更好的选择。

Bootstrap 3.1.1有一个.center-block类用于对div进行居中。见:http://getbootstrap.com/css/ helper-classes-center。

设置要显示的元素:通过页边距显示块和居中。可作为mixin和类使用。

<div class="center-block">...</div>

或者，正如其他人已经说过的，使用.text-center类将文本居中。

推荐文章