影响第一行以上和最后一行之后的行间距的行高

Question

我在侧面标题中有多行文字。想要两条线的间距增加，所以我设置了一个线高。当我这样做时，它不仅增加了两条线之间的空间，而且还增加了第一条线之上的间距（并且可能低于第二条线）。如何才能增加两条线之间的间距，而不会增加上下。

我知道这是Line-height的行为。但只是好奇是否有任何好的解决方案。

这只是我要问的例子。

Jsfiddle：http://jsfiddle.net/jitendravyas/V3eWV/

Answer 1

您可以使用负边距，但需要记住：

line-height是一件有趣的事情。根据{{​​3}}，它没有指定行高，而是指定行块的最小高度：

  

在内容由内联级元素组成的块容器元素上，'line-height'指定元素中行框的最小高度。最小高度包括基线上方的最小高度和其下方的最小深度，就像每个线框以零宽度内联框开头一样，其中包含元素的字体和线高属性。我们称这个想象的盒子为“支柱”。 （这个名字的灵感来自TeX。）。

CSS2.1中定义了一个换行符：

  

在内联格式化上下文中，框从水平排列，一个接一个，从包含块的顶部开始。这些框之间会考虑水平边距，边框和填充。盒子可以以不同的方式垂直对齐：它们的底部或顶部可以对齐，或者它们内的文本的基线可以对齐。包含形成一条线的框的矩形区域称为 线框。

这在9.4.2 Inline formatting contexts中不会改变，至少如果您不更改line-stacking。但是，没有直接针对您的问题的属性：您无法更改line-height的{​​{1}}，它将始终应用。

也就是说，暂时使用负利润率。更好的是，将您的元素包装在通用容器中。使用::first-line和:first-child，您可以添加任意数量的元素。

CSS3 very much

:last-child

<div>
    <h1>I've a text in side heading with multiple lines. Want the spacing the two lines to increase, so I set a line-height. When I do this, not only does it increase space between the two lines, it also increases spacing above the first line.</h1>    
    <h1>I've a text in side heading with multiple lines. Want the spacing the two lines to increase, so I set a line-height. When I do this, not only does it increase space between the two lines, it also increases spacing above the first line.</h1>
</div>