为什么跨度的线高是无用的
首先，让我们看一段代码：
http://jsfiddle.net/rFGkV/
为什么跨度线高未使用？ 行高仍然是200px，但是当我们将span的display属性设置为inline-block ，跨度的行高被使用？
见下文：
http://jsfiddle.net/B7z85/
块布局，比如div ，默认情况下，是由一组垂直的线框构成的，它们之间永远不会有空间，也不会重叠。 每个线框都从一个支柱开始，该支柱是一个假想的内联框，为该框指定的线高的高度。 线框然后根据线的高度继续标记的内联框。
下图显示了第一个例子的布局。 请注意，因为字体高度的1.7倍远小于支柱的高度，所以线高度由支柱的高度决定，因为线框必须完全包含其内联框。 如果将span上的行高设置为大于200像素，则线框将会更高，并且您会看到文本进一步分开。
当你制作span内嵌块时， div和span之间的关系不会改变，但是跨度会获得自己的块布局结构和自己的线框堆栈。 所以文本和换行符被放置在这个内部堆栈中。 内框的支撑是字体高度的1.7倍，即与文本相同，现在布局如下图所示，所以文本行相互靠近，反映了span的行高设置。
（请注意，这两个图表是在不同的尺度上）。
这是devise。 HTML文档中有两种元素types：块和内联。 内联元素不会中断文档的stream动，但块元素可以。
块元素，顾名思义，阻挡页面上包含一些内容的区域。 块元素的一些例子是： <p>和<div> 。 您可以将高度，行高和其他CSS属性应用于这些元素，以便更改块的大小，并随后更改文档的stream向。
内联元素占用了渲染它们所需的最小空间量，这意味着在这些元素上设置宽度和高度将不起作用。 正如你已经看到的，你可以告诉浏览器将一个内联元素作为一个块元素来允许你应用高度。
使用<li>元素创build菜单时可以看到这样的一个例子。 <li>是块元素。 如果您创build一个列表，这些项目将在页面上垂直显示，确保每个列表项目出现在前一个列表项目下方。 但是，如果您应用display: inline; 到列表项目，他们现在将水平显示。
