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

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

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

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


当前回答

添加答案。希望它能帮助到别人

<div class="row">
  <div class="col-sm-12 col-md-12 col-lg-12">
    <div class='d-flex flex-row justify-content-center'>
      <img     
        className='img-fluid'       
        src="<url>"
          />
    </div>
    </div>
</div>

其他回答

如果你使用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="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>

不要主要使用容器流体。

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

只需为你想要的div或标签使用一个类,text-center。我认为它可能会很好。它是一个用于文本对齐中心的引导类。

下面是一些文本对齐引导类:

text-left, text-right, text-justify, etc.
<div class="row">
 <div class="col-md-12 text-center">
  <h1>Bootstrap starter template</h1>
  <p>Example text.</p>
 </div>
</div>