1.line-height的定义
line-height--行高，2行文字基线之间的距离。
什么是基线？为何是基线？需要2行吗？
为何 line-height可以让单行文本垂直居中？不一定
2.line-height与行内框盒子模型
所有内联元素的样式表现都与行内框盒子模型有关！比如浮动的图文环绕效果....
内容区域：是一种围绕文字看不见的盒子。内容区域的大小与font-size大小相关；
内联盒子：内联盒子不会让内容成块显示，而是排成一行。如果外部含inline水平的标签（span,a,em等），则属于“内联盒子”。如果是个光秃秃的文字，则属于“匿名内联盒子”。
行框盒子：每一行就是一个“行框盒子”，每个“行框盒子”又是由一个一个“内联盒子”组成
p标签所在的“包含盒子“，此盒子由一行一行的'行框盒子'组成；
3.line-height的高度机理
--深入理解内联元素的高度表现
内联元素的高度是由于line-height决定的
line-height明明是2基线距离，单行文字哪来行高，还控制了高度？
需要知道的：
1.行高由于其继承性，影响无处不在，即使单行文本也不例外；
2.行高只是幕后黑手，高度的表现不是行高，而是内容区域和行间距。
内容区域高度+行间距=行高
1.内容区域高度只与字号以及字体有关，与line-height没有任何关系。
2.在simsun字体下，内容区域高度等于文字大小值。
行间距上下拆分，就有了“行半间距”
总结：行高决定内联盒子高度；行间距墙头草，可大可小（甚至负值），保证高度正好等同于行高。
多行文本的高度就是单行文本高度累加。
4.line-height各类属性值
支持属性值：
normal,number,length,percent,inherit
line-height:normal ：默认属性值，跟着用户的浏览器走，而且与元素字体关联
line-height:1.5: 根据当前元素的font-size大小计算
line-height:1.5rem:使用具体长度值作为行高值。
line-height:150%；相对于设置了该line-height属性的元素的font-size大小计算