fontSize && lineHeight && height的关系

413 阅读1分钟

font-size 字的高度,指的从一行中最低处到最高处的高度

line-height 行高, 指的2行文字的baseline之间的间距

height height div元素的高度

一张图解释

所以得出以下结论

  1. 行距 = line-height - font-size
  2. 如果 line-height === font-size, 
    1. 2行文字之间的间距为0
    2. 如果没有设置height,则总height为文本的高度和
    3. 如果设置了,则以height为准
  3. 如果line-height === height , 则文本垂直居中
  4. 如果height 没有设置 ,完全各级line-height值同步height值