10

我不明白为什么在我的段落中掉线以下的字母（如 g 和 y）会被截断。我尝试将线高设置得更高，但它仍然将它们切断。我在 px、pt 和 em 中使用了字体大小，但仍然没有运气。现在，当我将字体大小设置得更大（如 3.0em）时，问题就消失了。但我需要字体大约是这个大小。

这是链接：http ://sportegy.com/font-test/font-test.html

您需要使用该链接并查看我拥有的 .ttf 字体才能真正看到问题所在。不过，我也会在这里粘贴我的 HTML。

<html>
<head>
<style>
@font-face {
font-family: lib-font;
src: url('css/LiberationSansNarrow-Regular.ttf');
}
@font-face {
font-family: lib-bold;
src: url('css/LiberationSansNarrow-Bold.ttf');
}   
</style>
</head>
<body>

<span style='font-family: lib-font;color: #232322;font-size: 1.0em;'>   
The quick brown foxy was jumping over the green doggy.<br/>
The quick brown foxy was jumping over the green doggy.<br/>
The quick brown foxy was jumping over the green doggy.<br/>
The quick brown foxy was jumping over the green doggy.<br/>
The quick brown foxy was jumping over the green doggy. 
</span>

4

6 回答 6

25

尝试

line-height: normal;

似乎解决了一些人的问题。

于 2013-02-11T03:34:23.113 回答
3

尝试将行高增加到类似line-height: 1.2;

如果您将字体大小增加到 1.1em，它不会被截断。

我建议使用像Normalize这样的 CSS 重置。

于 2013-02-11T01:40:45.633 回答
1

我只能以精确的 16 像素（在我的浏览器上为 1em）复制它，所以我怀疑是这里和这里描述的字体问题。

您可以按原样使用字体并避免 16 像素，自己修复字体指标（如链接中所述），向字体创建者发送电子邮件，或选择其他字体。那里有很多好的免费字体，一切顺利:)

于 2013-02-11T03:59:55.930 回答
0

老实说，我发现解决此错误的唯一方法似乎是更改字体大小。某些自定义字体似乎存在一些错误，主要是在 Chrome 中。

我有同样的问题并将字体大小从30pxto更改为32px现在很好:)

于 2014-07-25T13:12:36.137 回答
0

这是因为字体文件的descender值太短了。降序是像 p,g,q 或 y 这样的字母。这些字母到达基线下方，因此字体文件应包含一个大于最低下降者的值。浏览器将上行和下行值视为字体“容器”，因此它将剪切任何超出这些值的元素。因此，CSS 无法解决此问题，因为问题存在于字体文件本身。

为了修复它，唯一的方法是编辑字体文件并更改这些值。尝试联系原始设计师。

不幸的是，免费字体必然会发生这种情况......

于 2014-11-12T18:35:03.923 回答
0

就我而言：

letter-spacing: normal;
于 2019-12-12T08:11:53.360 回答