css———理解height与line_height

定义

height和line-height的联系

如果不设置div的高度时，是div的font-size决定了div的高度还是line-weight的值？

测试一

CSS:
    .test1{font-size:20px; text-align:center;line-height:0; border:1px solid black; background: red;}
html:
    <div class="test1">测试</div>

结果：

---

测试二

CSS:
    .test2{font-size:1px; text-align:center;line-height:20px; border:1px solid black; background:red;}
html:
      <div class="test2">测试</div>

结果：

---

结论：在没有设置div的height属性时，div的高度根据line-height的大小而变化，且文字垂直居中。

div的height与line-height的大小关系不同时，会有什么显示结果呢？

（1）height = line-height时

（2）height>line-height时

（3）height<line-height时