图片和文字对齐，vertical

2024-07-16 09:32| 来源: 网络整理| 查看: 265

vertical-align设置行内元素垂直对齐的方式，属性值有：

baseline：与基线对齐 top：与顶端对齐 middle：与中部对齐 bottom：与底端对齐

文本前后有大小不一的图片，属性为baseline:

top:

bottom：

最常用middle，文字会和两张图片的中心对齐：

Document img { width: 200px; vertical-align: middle; }

123123123123123

使用图片时会有一个bug，图片底侧会有一个空白缝隙，原因是行内块元素会和文字的基线对齐。

解决办法：

1. 给图片添加 vertical-align:middle | top| bottom 等。（提倡使用的） 2. 把图片转换为块级元素 display: block;

【本文地址】

公司简介

联系我们