html – Bootstrap如何使文本在div容器中垂直对齐

概述在其列中间垂直对齐文本的最佳/正确的方法是什么？图像高度静态设置在CSS中. 我已经尝试设置一个外部div来显示：table和一个内部div来显示：table-cell with vertical-align：middle,但是也不起作用. HTML <section id="browse" class="browse"> <div class="container"> < 在其列中间垂直对齐文本的最佳/正确的方法是什么？图像高度静态设置在CSS中.

我已经尝试设置一个外部div来显示：table和一个内部div来显示：table-cell with vertical-align：mIDdle,但是也不起作用.

HTML

<section ID="browse" >    <div >        <div >            <div >                <h2 >link up with other gamers all over the world who share the same tastes in games.</h2>            </div>            <div ></div>            <div >                <img ID="animation_img2"  src="images/section2img2.png"/>                <img ID="animation_img1"  src="images/section2img1.png"/>            </div>        </div>    </div></section>

CSS

.browse .container,.blind_dating .container { padding-bottom: 0; }.animation_container { position: relative; }.browse .animation_container { height: 430px; }.animation_img { position: absolute; bottom: 0; }.animation_img1 { right: 25%; }.animation_img2 { right: 25%; }

解决方法 HTML：

首先,我们需要在文本容器中添加一个类,以便我们可以相应地访问和编辑它.

<div >     <h3 >link up with other gamers all over the world who share the same tastes in games.</h3></div>

CSS：

接下来,我们将应用以下样式来垂直对齐,根据它旁边的图像div的大小.

.textContainer {     height: 345px;     line-height: 340px;}.textContainer h3 {    vertical-align: mIDdle;    display: inline-block;}

全做完了！如果您认为它仍然略微偏离对齐,请调整上面样式的线高度和高度.

WORKING EXAMPLE

总结

以上是内存溢出为你收集整理的html – Bootstrap如何使文本在div容器中垂直对齐全部内容，希望文章能够帮你解决html – Bootstrap如何使文本在div容器中垂直对齐所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。