为什么'vertical-align”影响同级元素，而不仅仅是目标内联块元素？

垂直对齐兄弟姐妹，而不是自己

理解垂直对齐并不像人们想象的那么简单。如示例所示，出乎意料的是，仅将垂直对齐应用于内联块。除 之外的所有其他内容都垂直对齐内容本身。这是预期的行为吗？

不出所料，vertical-align 定义了元素在其父容器内的垂直对齐方式。与预期相反，只有 内容将对齐，浏览器会对齐所有元素，包括 p 父元素和 内的文本。

为了澄清，在没有任何对齐的情况下， 会对齐。其内容由浏览器渲染为等高并与 p 的顶部垂直对齐。

将 Vertical-align: middle 应用于 ;改变 p 内所有元素的垂直对齐方式。 p 本身现在与 高度的中点垂直对齐，并且 内的文本与 高度的中点垂直对齐。保持与其顶部对齐，看起来好像没有垂直对齐。

以上是为什么'vertical-align”影响同级元素，而不仅仅是目标内联块元素？的详细内容。更多信息请关注PHP中文网其他相关文章！