line-height
2015-09-11 10:49:51 3 举报AI智能生成
line-height的学习笔记
作者其他创作
大纲/内容
取值
body{line-height:120%;font-size:16px;}
h1{font-size:32px;}
p{font-size:16px;}
计算后：body：line-height：16px*120%=19.2px
这个计算的值会被层叠下去的元素所继承
所以会出现，太紧、太正好、太松
body{line-height:inherit;}
规定应该从父元素继承 line-height 属性的值。
body{line-height:normal}
normal约为1.2 所有继承下来的元素不会忽略本
身的font-size，而使用基于font-size算出来的
line-height现在，line-height会随着相关的
font-size做相应的比例缩放
被定义为一个长度值(px,em等) body{line-height:25px;}
后代元素会直接继承
所有继承下来的元素会忽略本身的字
体大小，而使用相同的line-height
被定义为纯数字， body{line-height:1.2}
同normal,但更灵活，可以自己设置值
建议：使用出数字
（很好的一篇文章）http://www.cnblogs.com/fengzheng126/archive/2012/05/18/2507632.html
应用
1.设置行高
div文字垂直居中
div居中对齐一直是个难题，水平还好解决些，margin：0 auto;
可以解决现代浏览器，IE下text-align:center。但垂直居中就
没那么简单了
解决方案
利用line-block这样做
This is a test.
This is a test.
This is a test.
单行就比较简单了，把line-height设置为box的大小可以实现单行文字的垂直居中
This is a test.
收藏
收藏
职业：暂无
0 条评论
下一页
