html - 如何将标题直接定位在其自己的底部边框之上？

Question

我如何才能让标题与自己的底部边框齐平？有负填充这样的技术吗？我必须改用下划线吗？或者以某种方式将它定位在它下方元素的顶部边框上？非常感谢。

h1 {
  font: bold 100px/normal Helvetica;
  color: blue;
  border: 5px solid black;
  background-color: red;
}

<h1>HEADING TOO HIGH</h1>

Answer 1

您可以尝试类似这样的操作，并尝试使用 line-height 属性。

h1 {
    line-height: 40px;
    height: 30px;
    padding: 0px;
    border: 1px solid black;
}

<h1>HEADING TOO HIGH</h1>