css - 如何在 CSS 中添加文本高度

Question

我有一个 h1 标签，代码如下所示

HTML

<h1>Awesome title</h1>

CSS

h1 {
    line-height:3px
}

我只想向上缩放文本，此文本的宽度将保持不变。

Answer 1

是的，你可以，使用转换。例如，这段文字的高度是原来的两倍。

.tall {
    display:inline-block;
    -webkit-transform:scale(1,2); /* Safari and Chrome */
    -moz-transform:scale(1,2); /* Firefox */
    -ms-transform:scale(1,2); /* IE 9 */
    -o-transform:scale(1,2); /* Opera */
    transform:scale(1,2); /* W3C */
}

它的运作方式是这样的:

transform:scale(width,height);

如果我希望它的高度仅为宽度的 1.5 倍，我可以使用:

transform:scale(1,1.5);

演示: http://codepen.io/Pachonk/pen/vNVaKr