为什么浮动对准基线默认是top而inlineblock对准基线是bottom?

Fakefish
  • 4.3k

为什么浮动对准基线默认是top而inlineblock对准基线是bottom?

回复
阅读 4k
1 个回答
Humphry
  • 16.4k

vertical-align要在IFC语境下才有意义。

float没有vertical-align一说。在它被置为float的那一刻,它的display计算值为block,同时也不在之前所在的IFC(内联格式化上下文)中了(如果它之前有在的话),它不参与行内元素的打打闹闹。相反,作为校内一霸,它还会挤压行内元素打闹的水平空间。


inline-block对准基线是bottom?
不是的。

display:inline-block以后,默认的vertical-align依然是baseline,它依然对齐于它所在line-box的baseline。

http://jsfiddle.net/y9w4b0ac/

图片描述

or 你可以给出一个demo,我们来分析一下为何会出现这样的结果。

宣传栏