line-height取值方式以及它的继承

1.height区别

heigh是写死的高度，line-height是一行的高度，与font-size有关，下面是一个案例

  <div class="div">
        翻一本旧书，里面一枚书签滑落在地。<br>
        见上面有几行小字，<br>
        只为了亿万光年里的那一刹那……<br>
        我与你相聚与你别离，<br>
        完成了上帝所做的一首诗
</div>

  .div{
            height: 200px;
            width: 200px;
            background-color: pink;
  }

 

 接下来我们使用line-height:  line-height: 50px;

   .div{
            width: 200px;
            background-color: pink;
            line-height: 50px;
        }

可以看见，没有写盒子的height，盒子会被行高撑开，一行是50px,如果设置了height，则文字会溢出。

2.取值方式

 除了length，也就是直接写px值的方式不会继承，写的是多少就是多少，其他的方式都会继承，normal和纯数字是继承数字，nomal继承1.2，浏览器的默认值，inherit是继承父元素，百分比是继承的计算结果，而不是这个百分比

它们的计算方式是自身的font-size与数字的乘积