CSS基于文本顶部定位文本？

当我在CSS中更改字体的大小时，我如何使它无论字体大小（从12px到200px），文本的“大写高度”（pic）总是“视觉上”在顶部有10px的填充

否则，我要做的就是每次更改字体大小时，我必须返回并重新定位顶部/页边顶部等

以下是我所拥有的：

CSS:

HTML示例：

<div id='header'>
  <div class='intro'>
    Stuff before the statement
  </div>
  <div class='statement'>
    <h3>
      <p>A Statement</p>
    </h3>
    <div class='large_spacer'></div>
  </div>
  <div class='clearfix'></div>
</div>

陈述前的东西
声明

这就是

行高0时的外观：


这与
行高：1
：

如果我将
字体大小从160px更改为20px，则空格将按比例变小。。。我该怎么做

注意：它添加了20像素的额外空白，即使边距为0；填充：0

否则我所做的就是每次
我改变了字体大小，我得走了
返回并重新定位顶部/页边距顶部
等等

为什么不改为在文本上方和下方设置元素的
bottom
和
margin bottom
？这样，您就不必修改文本样式，间隙将始终存在

还有，为什么在世界上，你可以触摸字体大小超过36像素？在任何情况下，您也可以使用
行高
样式，例如
行高：30px或任何值

否则我所做的就是每次
我改变了字体大小，我得走了
返回并重新定位顶部/页边距顶部
等等

为什么不改为在文本上方和下方设置元素的
bottom
和
margin bottom
？这样，您就不必修改文本样式，间隙将始终存在

还有，为什么在世界上，你可以触摸字体大小超过36像素？在任何情况下，您也可以使用
行高
样式，例如
行高：30px
或任何值。
如果您真正的意思是“在顶部”的封口高度，而不是在封口高度边距内，那么您可以将CSS填充应用于字体元素或其父容器：

<span class="something">Web Typography</span>

span.something {padding-top: 10px;}

网页排版
span.something{填充顶部：10px；}

或者

网页排版
.something{padding top:10px；}

根据您正在应用的其他样式，其中一种方法将是合适的。
如果您真正的意思是“在顶部”的封口高度，而不是在封口高度边距内，那么您可以将CSS填充应用于字体元素或其父容器：

<span class="something">Web Typography</span>

span.something {padding-top: 10px;}

网页排版
span.something{填充顶部：10px；}

或者

网页排版
.something{padding top:10px；}

根据您正在应用的其他样式，其中一种方法是合适的。
尝试将padding top:10px添加到#header.statement h3{}

编辑：

是否重置了#header.statement h3 p{}的值？
尝试将padding top:10px添加到#header.statement h3{}

编辑：

是否重置了#header.statement h3 p{}的值？
是否尝试设置包含元素的填充顶部？看起来我必须设置
行高度：0.8
，才能设置正确的底部。然后我可以使用填充。。。这是为什么？它可能是在添加你所说的20px，因为你在一个文件中粘贴了一个标签。如果您没有重置标记上的边距和线条高度，就会发生这种情况。更好的是，去掉标记。您是否尝试过设置包含元素的填充顶部？看起来我必须设置
行高：0.8才能设置正确的底部。然后我可以使用填充。。。这是为什么？它可能是在添加你所说的20px，因为你在一个文件中粘贴了一个标签。如果您没有重置标记上的边距和线条高度，就会发生这种情况。更好的是，去掉标记。没有用，我仍然有来自未知地方的20px空白。如果我将行高设置为0，则它将指向大部分字母的起始位置。行高度必须起作用，不是吗？嗯，文本在行框中总是垂直居中，就像将垂直对齐设置为50%。所以根据字体大小，它会溢出行框。不起作用，我仍然有20px的空白，来自未知的地方。如果我将行高设置为0，则它将指向大部分字母的起始位置。行高度必须起作用，不是吗？嗯，文本在行框中总是垂直居中，就像将垂直对齐设置为50%。因此，根据字体的大小，它将溢出行框。
<div class="something"><span>Web Typography</span></div>

.something {padding-top: 10px;}