html - 为什么我的书名总是在字母下方有多余的空间？

这是我一直想知道的事情。由于某种原因，这种情况经常发生，我不知道为什么。通常，我通常只给元素一个高度和一个线条高度，以使文本在小框内居中。

这是我的代码：

<h3 class="hr_title">Things to know before</h3>

这就是它的css。

.hr_title{
   background-color: navy;
   color: white;
   font-family:proxima-nova, sans-serif;
   font-weight: 100;
}

下面是它的外观照片。



忘了提。即使我添加text-transform：uppercase或它们都是大写字母，也会发生这种情况。

最佳答案

它用于具有降序的字母，例如g或j。即使您不使用带有降序的字母（例如全部大写），它仍然是字符度量的一部分。

text-transform:uppercase只是更改字母的大小写。它对字符度量没有任何作用。例如，它不会删除将保留下级字符的字符布局部分。