为什么取消选中此图像上的vertical-align属性会更改列表而不是图像？

Question

为什么取消选中此图片上的vertical-align属性会更改列表而不是图像？

选中：

未选中：

Answer 1

内联元素共享一个名为linebox的隐形指南。线盒引导其内部元素相对于彼此的垂直定位。因为它封装了这些内联元素之间的关系，所以盒子本身也会受到这些元素的影响。

当图像的垂直对齐设置为＆＃34;中间＆＃34;时，线框将移动到父容器的中心。这是因为图像元素大于线框，因此线框是在属性更改时移动的线框（如果图像小于线框，图像将移动而不是线框）。

从图像中删除垂直对齐使其默认返回＆＃34; baseline＆＃34;，并且当重新排列linebox和image的基线时，现在，linebox位于父容器的底部，其中包含的其他内容也是如此。

Here's a really good read on the whole thing（比MDN文档更有用）