如何将图像与Bootstrap列中的中心对齐? [英] How can I align an image to the center in a Bootstrap column?

查看:200
本文介绍了如何将图像与Bootstrap列中的中心对齐?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

愚蠢的问题:我连续有三张图片,但它们在列中左对齐。如何将它们与列的中心对齐?

Stupid question: I have three images in a row, but they are aligned to the left in their column. How can I align them to the center of the column?

这是我的代码:

 <div class="container partners">
<div class="row">
<div class="col-md-4 col-sm-4 col-xs-4">
<img src="swz.png" alt="streetwize" class="img-circle" class="img-responsive" style="max-height:180px">
</div>
<div class="col-md-4 col-sm-4 col-xs-4">
<img src="ogon.png" alt="ogon" class="img-circle" class="img-responsive" style="max-height:180px">  
</div>
<div class="col-md-4 col-sm-4 col-xs-4">
<img src="congaz.png" alt="ogon" class="img-circle" class="img-responsive" style="max-height:180px">    
</div>
</div>

和CSS:

.partners {
display:block;
margin: 0 auto;
vertical-align:middle;
}


推荐答案

添加文本中心类到你的列divs

Add the text-center class to your column divs

<div class="col-md-4 col-sm-4 col-xs-4 text-center">

这篇关于如何将图像与Bootstrap列中的中心对齐?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆