首页 > Bootstrap中居中问题

Bootstrap中居中问题

如图,我怎么让说爱我这几个字居中呢?代码如下:

</nav>
<div class="container" style="background-color: #FFF;margin-top: 60px">
    <div class="row">
        <div class="col-xs-4 text-center" style="background-color: grey;"><label style="font-size: 16px"> 说爱我</label></div>
        <div class="col-xs-8">
            <select class="form-control">
                <option>我爱你</option>
            </select>
        </div>
    </div>
</div>

加.text-center


垂直还是水平?


.center{

display: table;
margin-left: auto; 
margin-right: auto;

}


尽量不要写行内样式


line-height


line-height:34px;vertical-align:middle;,就可以垂直居中


如果是文字垂直居中的话,有许多情况可以处理:

  1. 给文字设置与容器高度一致的的line-height;

  2. 把容器设置为表格模式 display:table; 并vertical-align:middle;

  3. 直接设置padding的上下边距相同值


父元素设定与自身高度一致的line-height

【热门文章】
【热门文章】