10
6
2011
0

css 之 line-heigt & height & font-size 摘记

line-height 属性设置行间的距离(行高)。

 

该属性会影响行框的布局。在应用到一个块级元素时,它定义了该元素中基线之间的最小距离而不是最大距离。

line-height 与 font-size 的计算值之差(在 CSS 中成为“行间距”)分为两半,分别加到一个文本行内容的顶部和底部。可以包含这些内容的最小框就是行框。

 

总结:line-height减去font-size,所得的高是当前文字的顶端距离上一行文字的底端的长度。或者说是line-height包含了font-size,而其差值则平分在font-size即文字的上下两侧了!

    其中line-height似乎不能为负的样子,但它与font-size的差值可以为负,如果为负的话,二行文本就会出现重叠现象了!

  需要注意的是line-height可以填相对值,如1,表示与font-size同。

 

本文仅仅作个记录,若要详细了解请自行网上搜索或见参考资料。

参考资料:

  http://www.w3school.com.cn/css/pr_dim_line-height.asp

  关于使用line-height单行文本的垂直居中问题

Category: Web摘记 | Tags: css | Read Count: 1509

登录 *


loading captcha image...
(输入验证码)
or Ctrl+Enter

Host by is-Programmer.com | Power by Chito 1.3.3 beta | Theme: Aeros 2.0 by TheBuckmaker.com