我正在使用 Bootstrap 创建一个用户个人资料页面,其中图像位于左侧,用户详细信息位于右侧。
我是这样用的:
<div class="row">
<!-- Col 1 -->
<div class="col-md-4 col-xs-6">
<div>
<img ..>
<h2>Name of the user</h2>
Sample text<br>
<a href="#"><img src="..."></a>
<a href="#"><img src="..."></a>
</div>
</div>
<!-- Col 2 -->
<div class="col-md-4 col-xs-6">
<div>
<ul class="nav nav-tabs" role="tablist">
<li>...</li>
</ul>
</div>
</div>
</div>
在用户图片下方,会显示他/她的名字,然后是他/她在社区中的积极参与情况,然后是指向他/她的社交媒体的链接。
当我在桌面上查看它时,它看起来不错。但是,当我尝试在移动设备上查看它时,第一列的整个内容都左对齐。我希望它对齐中心,所以它看起来合适。我怎样才能做到这一点?还是我犯了什么错误?
最佳答案
你需要的类是center-block
关于css - 如何居中对齐网格列(col-md-4 和 col-md-8),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36605154/