为什么垂直对齐:中间不起作用?然而,垂直对齐:top确实有效
span{
垂直对齐:中间对齐;
}
<;部门>;
<;img src=”https://via.placeholder.com/30“alt=”小img“/>;
<;span>;不起作用。</span>;
</部门>
实际上,在这种情况下,它非常简单:将垂直对齐应用于图像。因为所有内容都在一行中,所以实际上是要对齐的图像,而不是文本
<;!--将“垂直对齐:中间”样式从span移动到img-->;
<;部门>;
<;img style=“垂直对齐:中间”src=”https://via.placeholder.com/60x60“>;
<;span style=“”>;工作。</span>;
</部门>
在FF3中测试
现在,您可以将flexbox用于这种类型的布局
.box{
显示器:flex;
对齐项目:居中;
}
<;div class=“box”>;
<;img src=”https://via.placeholder.com/60x60“>;
<;span style=“”>;工作。</span>;
</部门>