如何通过设置vertical-align属性消除CSS图片下方空白间隙？
- 内容介绍
- 文章标签
- 相关推荐
本文共计1048个文字，预计阅读时间需要5分钟。
图片下方的空白空间并非bug，而是inline元素baseline对齐的自然结果；vertical-align可以解决，但必须满足前提条件，否则写了也白写。
vertical-align 对 img 生效的前提是什么
这个属性只在 img 处于行内格式化上下文（IFC）时才起作用——也就是说：img 必须是 display: inline 或 display: inline-block，且其父容器不能是 display: flex 或 display: grid。
本文共计1048个文字，预计阅读时间需要5分钟。
图片下方的空白空间并非bug，而是inline元素baseline对齐的自然结果；vertical-align可以解决，但必须满足前提条件，否则写了也白写。
vertical-align 对 img 生效的前提是什么
这个属性只在 img 处于行内格式化上下文（IFC）时才起作用——也就是说：img 必须是 display: inline 或 display: inline-block，且其父容器不能是 display: flex 或 display: grid。