CSS删除h标签中的空白空间

Question

有什么方法可以去除h标签顶部的空白空间？

h1 {
  border: 1px solid;
  margin: 0;
  padding: 0;
  line-height: normal;
}

<h1>Test Title yg</h1>

Answer 1

文本上方的空格取决于字体类型和所用字体的大小。当使用大字体时，它一定会在文本的顶部和底部显示一些额外的空间。您可以将margin-top标签中的h1设置为-10px，或者为该问题进行调整。

Answer 2

您应该在寻找：

javac

h1 {
  border: 1px solid;
  margin: 0;
  padding: 0;
  line-height: 1.4rem;
  padding-bottom: 8px;
}

希望这就是您想要的！
但是，HTML特殊字符需要此空间。
请看一下HTML字符here

Answer 3

您可以使用line-height: calc(1em + 2px);来删除一些空间，但是有可用空间的原因。在“ g”和“ y”的底部，边框有一些空间。使用line-height: calc(1em + 2px);可以删除此空间，但不能删除“ T”上方的空间。可能有诸如ÄÖÜ（德语）之类的字符需要上方的空白，而诸如gyq之类的字符则需要下方的空白。

h1 {
  border: 1px solid;
  margin: 0;
  padding: 0;
  line-height: calc(1em + 2px);
}

<h1>Test Title yg</h1>

Answer 4

顶部和底部空间实际上来自字体系列，但是您可以通过将line-height: normal;更改为line-height: 1.4rem;来删除顶部空间。希望对您有用。谢谢

h1 {
  border: 1px solid;
  margin: 0;
  padding: 0;
  line-height: 1.4rem;
}
<h1>Test Title yg</h1>