html - 更改文本和图像的对齐方式，使视觉中心正确对齐。 ( Bootstrap )

Question

我有这个:

    <div class='container'>
        <div class='row'>
            <div class="col-md-5 col-sm-4 col-xs-12">
text goes here
    
            </div>
        </div>
        <!--//col-->
    
        <div class='col-md- col-sm-6 col-xs-12'>
            <div class='text-center'>
image goes here
    
    
            </div>
        </div>
    
    </div>

图片会告诉我我正在努力做得更好。这是它现在的样子:
坏蛋.png

它排列得很好，但看起来不太好。我想改为将图像的中心与文本匹配。
good-pupper.png

我应该怎么做？

Answer 1

您可以将两个内容 div 包装在一个新的 div 中。您将给新的 div 指定高度，line-height。这样你就可以使用 vertical-align 来让图像按照你想要的方式居中