HTML/CSS - 不同的文本元素是否具有固有的不同大小？

Question

我遇到的一个问题是在不同元素中对齐文本。这方面的一个例子发生在这里-

如您所见，两个文本的突出显示空间相同(右侧文本的灰色区域)，但 h1 元素本身不包含右侧的突出显示区域，而 span左侧确实包含它，从而产生更大的元素(独立于样式)。

我不知道是什么原因造成的，如果有人能找出这个问题的原因，那将是一个巨大的帮助。

Answer 1

首先你应该重置元素的默认CSS http://cssreset.com/这将从元素中删除任何默认边距和填充。然后在您的样式表中编写一个类并将其应用于这两个元素。不要使用内联样式，从长远来看它太困惑了，它会让你的开发更加枯燥。您应该将行高设置为与字体大小相匹配，例如 1rem 到 1rem 或 16px 到 16px，因为根据父值 1rem 可能不等于 16px。