如何测量CSS线高度？ [英] How CSS line-height is measured?

问题描述

CSS中的行高是从文本底部到下一行文本的底部吗？或者是文本垂直居中在线的中心？

请参阅示例图片：

解决方案

Is line-height in CSS goes from the bottom of the text to the bottom of the next line's text? or is text is vertically centered inside of the line?

Please see the example image:

解决方案

Form MDN :

On block level elements, the line-height CSS property specifies the minimal height of line boxes within the element.

On non-replaced inline elements, line-height specifies the height that is used in the calculation of the line box height.

As you can see in this DEMO and the folowing image. This means that for text, line-height defines the height of the box surounding the letters vertically centered inside that box so your first example is right.

Image from www.w3.org

这篇关于如何测量CSS线高度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！