我的字体在其范围内显得过高

时间:2017-06-22 18:17:18

标签: css fonts

我试图理解为什么此跨度中的字体不会垂直居中显示。如果您查看突出显示的跨度,您会注意到虽然文本的顶部是齐平的,但底部距离跨度的底部是几个像素。这样可以使文本看起来不是垂直居中的。

事情并非如此:

行高:当前设置为“1”。任何其他值都会导致较大的行高,文本仍然垂直偏移。

垂直对齐:无论我如何设置显示(内联,内联块等),更改垂直对齐都不起作用。

Span highlighted

3 个答案:

答案 0 :(得分:3)

我认为它是垂直居中的,因为字母的底部偏移,例如" j,q,g,p .." - 底部/ descender,尝试将这些字母粘贴在" span"中,如下所示:

<div>
  <span>
    <span>Eqpjg combinedqjpg</span>
  </span>
</div>

我为你创建了这个例子https://jsfiddle.net/vfusz07z/1/。反之亦然,如果你在我上面提到的单词/句子中有字母,同时你没有大写字母,你会看到文字看起来与底部对齐

答案 1 :(得分:1)

在您的示例中,您没有带下划线的字母。尝试使用&#34; Tagcloud&#34;或者&#34; Taj Mahal&#34; - (字母g,j)然后你会看到它填满整个高度......

答案 2 :(得分:0)

看起来字体(Avenir Pro)恰好是奇怪的基线。