css 文字高度上下有留白问题

Posted 2022-12-04 哈娄

问题描述

平时布局字体设置font-size之后，发现高度会比正常ui设计的要高，字体的上下有些留白区域占位置，如图：

原因和解决办法：

因为字体有默认行高。

• 如果是一行文字：我们给它的line-height设置为1
• 如果是多行文字: 我门就设置它的line-height等于它的font-size

就可以解决了。