Html 使用vw字体大小时的文本填充

我正在使用

vw

根据打开页面的浏览器进行文本放大。然而，填充比预期的要大。我希望它完全在我的页面的上角，几乎没有填充。（我尝试了

填充：0px；

但没有结果）。下面是一个例子：

在HTML中：

<heading>some text</heading>

---

要获得您想要的结果，您可以执行以下操作之一：

1-使用线条高度

<div>some text<br/>line 2</div>

div {
  font-size: 5vmax;
  padding: 0px;
  line-height: 0.75em;
  background:lightgray
}

body {
  margin: 0;
}

一些文本
第2行
div{
字体大小：5vmax；
填充：0px；
线高：0.75em；
背景：浅灰色
}
身体{
保证金：0；
}

2-你可以加上负的边距来绕过它

<div>some text</div>

div {
   font-size:5vw;
   margin-top:-15px;
}

一些文本
div{
字体大小：5vw；
利润上限：-15px；
}

---

这可能是因为大多数字体（包括系统字体）没有完全延伸到每个字形的边界框的顶部和底部。这意味着即使图元的高度为

1em

，大写字母也不会触及图元的顶部

为了解决这个问题，你可以用你的字体做实验，看看字母的顶部和底部会落在哪里。这可能是不同的字体，也取决于有多高的上升。通常，上升杆比帽高

对于《泰晤士报新罗马报》，以下内容适用于大写字母：

<span>Foobar</span>

span {
  background: #ddd;
  display: inline-block;
  line-height: .70em;
  vertical-align: text-top;
}

---

FOOBAR

某些浏览器是否仍在正文上添加填充或边距？尝试

body{padding:0；margin:0；}

<span>Foobar</span>

span {
  background: #ddd;
  display: inline-block;
  line-height: .70em;
  vertical-align: text-top;
}