CSS:文字不在图片中间

平时用的text-align属性比较多，相比较而言vertical-align则用的比较少。

 

当文字和图片布局在一起时，文字不能对齐到图片的中间，向这样：

HTML:

<div>
<img src="2.jpg" alt="">哈哈哈哈哈哈哈哈哈
</div>

CSS:

　　div{
　　　　width: 200px;
　　　　height: 50px;
　　}

 

此时需给img元素设置vertical-align:middle即可

　　div img{
　　　　vertical-align: middle;
　　}

效果图：