您现在的位置:首页 >> 前端 >> 内容

css-行高

时间:2016/12/3 9:48:00 点击:

  核心提示:什么是行高?行高是基线和基线之间的距离 行高=文字高度+上边距+下边距 文字在盒子中垂直居中:文字的行高lineHeight=盒子高度height行高的单位文字大小行高单位最终行高值16px16px-...
什么是行高?行高是基线和基线之间的距离 行高=文字高度+上边距+下边距 文字在盒子中垂直居中:文字的行高lineHeight=盒子高度height
行高的单位

文字大小 —– 行高单位 —— 最终行高值
16px————16px————-16px
16px————2em————–32px
16px————200%————-32px
16px————2——————32px

总结:除了直接设px值外,行高的值=文字值 X 行高单位

计算行高时,文字大小值是参考子元素的还是父元素的?

父元素文字大小——–子元素文字大小——–行高单位——–行高值
30px———————–20px—————30px————-30px
30px————————20px————–1.5em————45px
30px————————20px————–150%————45px
30px————————20px————–1.5—————30px

总结:不带单位,参考子元素;带单位,参考父元素

总之,尽量就设px就万事大吉 keke…

Tags:CS SS S行 行高 
作者:网络 来源:baozhuona的