css - 有没有办法删除 [sans-serif] 文本之前(或之后)的字体内空间？

Question

查看示例代码:

span {
  font-size: 150px;
  background: lightgray;
  margin: 8px 0px;
}
.sans-serif { font-family: sans-serif; }
.serif { font-family: serif; }

<span class="sans-serif">Done</span>
<br>
<span class="serif">Done</span>

我假设额外的空间是“内置的”，但有没有办法以某种方式删除它？

我正在尝试将一些大页面标题与下面的小得多的副标题左对齐。

Answer 1

这没有正确的方法，因为它是那种显示方式的字体。考虑以下示例:

span {
  font-size: 150px;
  background: lightgray;
  margin: 8px 0px;
}
.sans-serif { font-family: sans-serif; }
.serif      { font-family: serif; }
.serif2     { font-family: Times; }

<span class="sans-serif">Done</span>
<br>
<span class="serif">Done</span>
<br>
<span class="serif2">Done</span>

如果在我的电脑中是衬线，上面的图像有不同的布局。因此，这是一个反复试验的基础，您必须确保您正在做的事情在所有计算机和浏览器中都没有问题。 Times 字体非常适合，serif 字体有一些空间。这就是为什么我说它是一种试错方法。

唯一的hacky解决方案是根据字体对内容使用负边距，您不能将其概括。