在Bootstrap中执行列的正确方法是什么

Question

我正在尝试在this image之上创建行，但我遇到了问题

Here is how it looks for me

还有我的代码

<div class="row">
<div class="images col">
    <div class="image">
        <img class="" src="images/Layer%206%20copy%202.png">
    </div>
</div>
<div class="info col">
    <h2>waleed mahmoud mostafa</h2>
    <h2>living in cairo</h2>
    <h2>student</h2>
</div>
</div>

Answer 1

如果你想要居中的图像，那么使用偏移和文本中心类

<div class="row">
        <div class="images col-sm-6 col-sm-offset-3">
            <div class="image text-center">
                <img class="" src="images/Layer%206%20copy%202.png">
            </div>
        </div>
        <div class="info col-sm-6 col-sm-offset-3">
            <h2>waleed mahmoud mostafa</h2>
            <h2>living in cairo</h2>
            <h2>student</h2>
        </div>
    </div>

Answer 2

Bootstrap 4：

<div class="container">
    <div class="row">
        <div class="col">
         Content
        </div>
    </div>
    <div class="row">
        <div class="col">
         Content
        </div>
    </div>
</div>

Bootstrap 3：

<div class="container">
    <div class="row">
        <div class="col-xs-12">
         Content
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
         Content
        </div>
    </div>
</div>