【CSS】line-height: 120% 和 line-height: 1.2有什么区别?
line-height
属性用于指定行高。当你使用百分比值(如 120%
)时,行高是相对于该元素的字体大小计算的。例如,如果元素的字体大小为 14px
,则 line-height: 120%
等同于 line-height: 16.8px
。
当你使用数值(如 1.2
)时,行高是相对于该元素的字体大小计算的,但是这个数值会被继承。例如,如果父元素的字体大小为 14px
,则 line-height: 1.2
等同于 line-height: 16.8px
。但是,如果子元素的字体大小为 18px
,则它的行高将为 21.6px
(即 18px * 1.2
),而不是继承父元素的 16.8px
。
因此,当你使用百分比值时,子元素会继承计算后的行高值;而当你使用数值时,子元素会继承这个数值,并根据自己的字体大小重新计算行高。