CSS / Sass:将不同的字体大小设置为基线 - 公式

时间:2015-12-29 13:05:51

标签: css sass

我试图了解如何在CSS中将文本设置为基线。我发现一旦字体大小改变,我就需要调整行高。

一些在线工具和Sass mixins就是这样做的,但我想了解这个公式。

例如,一个mixin就是这样的:

line-height: ceil($font-size / $page-line-height) * ($page-line-height / $font-size);

Fiddle(使用inspect元素查看样式)

对于font-size 26px1.84615的行高基于$page-line-height的{​​{1}}计算。

但究竟是什么计算在这里,为什么它有效?为什么有必要使用24px

1 个答案:

答案 0 :(得分:0)

不确定我完全理解这个问题。我不知道为什么mixin使用那个公式,如果你问我,它看起来过于复杂,而且根本没有标准。

但是,如果您想根据字体大小更改行高,请使用ems,例如:

line-height: 1.6em;

无论字体大小如何,都会将行高设置为1.6 *。

更准确地说明公式....只需做总和

line-height: ceil(26 / 24) * (24 / 26); line-height: ceil(1.08) * (0.92); line-height: 2 * 0.92; line-height: 1.84615;