3

任何人都知道是否可以使用 CSS 保持恒定的行距，即使您在一行上使用不同的字体大小？下面是一个示例，其中第二段的行距大于第一个。我尝试将 CSS 中“巨大”跨度的 line-height 设置为 0，但这似乎还不够。

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Line Spacing Test</title>
<style type="text/css">
body {
    font-size: 14px;
    line-height: 1;
}
.huge {
    font-size: 64px;
    line-height: 0;
}
</style>
</head>
<body>

<p>Here is a line using normal font size.<br />
Here is another line using normal font size.</p>

<p>Here is a line with a span with <span class="huge">huge</span> font
size.<br />
Here is another line with a span with <span class="huge">huge</span>
font size.</p>

</body>
</html>
4

1 回答 1

2

只有将行间距设置得足够大以容纳所使用的最大字体，才能使行间距保持不变。根据规范，line-height在块元素上设置会设置行框的最小高度。对于内联元素，事情要复杂得多，但归根结底是让浏览器最终决定行框的高度，从而决定间距。

但是，在某些浏览器上，您可以说服浏览器使用您的身高，例如通过添加

span { display: inline-block; height: 16px; }
于 2013-01-21T14:59:37.737 回答