line-height&vertical好基友关系
line-height
- line-height确定line-box的高度
- 同一行内,各line元素的line-height共同确定该行的line-boxes的高度
- block元素没有定高度,由block元素内的block元素和inline元素共同确定该元素的高度。
1 | <div style="line-height:1.5; border:1px solid #34538b;font-size: 16px;"> |
vertical-align
w3c标准
元素内vertical对齐顺序,分为两类:
- 非top,bottom对齐方式,根据行内框高度,行内文字来进行对齐。
- 对齐后,取top,bottom对齐元素的最大值的元素,来对齐以确定该元素的行框的top或bottom。之后再分别对齐。