平时用的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;
}
效果图: