CSS vertical-align 设置行内元素的垂直对齐方式

vertical-align 用于设置行内元素的基线相对于该元素所在行的基线的垂直对齐（设置行内元素和行内块级元素的垂直对齐方式）

属性值	说明
baseline	基线对齐，默认值
top	元素的顶端与行中最高元素的顶端对齐
middle	把此元素放置在父元素的中部
bottom	元素的顶端与行中最低的元素的顶端对齐

默认基线对齐：

.box {
  background: pink;
}

<div class="box">
  <img src="./images/cat.jpg" alt="">
  <span>这是一段文本</span>
</div>

顶端对齐：

.box span {
	vertical-align: top;
}

如果想让与 img 标签同级的文本垂直居中对齐可以设置 img 标签的垂直居中：vertical-align: middle;

line-height 用于设置行的高度，其属性值不允许为负值

更新中。。。