line-height 的一个简单问题

Question

在写HTML和CSS的过程中，发现对line-height有些不明白。HTML代码：<div class="p">   <span class="c">Color</span> </div>CSS代码：*{  margin:0;  padding:0  }.c{  color:white;  font-size:20px;  line-height:40px;  background:orange;  display:block }效果图：代码都十分及其非常简单，span标签的高度是40px，但是我想问的是，假如将上面display:block这一行注释掉，这时候span标签的高度为auto，是22px，而div的高度却变成了40px，并且背景颜色的范围只包括span标签问题：为什么假如没有display:block这一句，光凭line-height为40px并没有将span标签的高度撑开？却把div的高度撑开到40px了？链接：链接