Question

我有一个长文字标题（<h1>）。由于文本不适合一行，浏览器会破坏该行。但是，标题的高度不会缩放，即没有换行符的标题与具有换行符的标题具有相同的高度。我正在使用背景图片，该图片应始终位于标题的所有文本后面。但由于高度不会缩放，隐含换行符的标题看起来很尴尬：背景只在第一行后面，第二行根本没有背景。为什么不是标题尺度以及如何缩放？

Answer 1

它确实缩放：http://jsfiddle.net/charlescarver/uUpqL/

我的猜测是，您要么设置<h1>标签的高度，要么您的背景图像不会重复拉伸。

Answer 2

默认情况下，这里的背景比例是一个简单的例子

<html>
<style>
    h1 { width: 5em; background-color: #EFA; }
</style>
<body>
<h1>A very long title which cannot enter into only one line!</h1>
</body>
</html>

现在，为了帮助你：

您可能没有在CSS中正确设置h1 {background-repeat: y-repeat;}。或者
你可能强迫h1身高：h1 { height: 20px; }如果你想要管理不同的身高，这是错误的。

Answer 3

好吧，假设您希望h1只有一行：

h1 {
    white-space: nowrap;
}

如果您希望h1只有一行和包含在给定的宽度内：

h1 {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

HTML标题无法正确缩放

3 个答案: