我一直在为一个客户做一个项目，一切都没事，直到我注意到我的h1 / h2 / h3（任何标题标签）已经转移到正确的2 / 3px。他们可能一直这样做，但我只是注意到了。当您在devtools中突出显示时，可以清楚地看到间隙（参见下面的示例）
之前是否有人注意到这一点或遇到过它？谷歌搜索一直很难，因为每当你询问前后的空格时，答案都是关于空间的上方和下方，而不是在文本开始之前。我已经在Chrome，Firefox和IE中测试过，问题也是一样的。我已经绕过它左边：-2px hack但是这样离开它并不好，我也很好奇为什么。看看它，我认为它可能与正在设置的-webkit-margin-before属性有关，但即使用！important清除它也无法修复它。我也尝试使用necolas normalize css文件来查看是否有帮助，但没有任何反应。我正在使用从一个更大的项目继承的样式（并添加我自己的样式），但之前没有看到过类似的东西。 （或许也许从未注意到它......）
它似乎也只出现在h标签的第一个字母上 - 所以在这个多行示例中：
second example showing multi-line h tag
空格仅出现在第一个字母之前，下一行正常。
我在h2标签上粘贴了计算样式的一个镜头 - 当您看到右侧突出显示的文本时，您应该能够看到间隙。
computed styles and another image
有点难过，并寻求一些帮助。
答案 0 :(得分：0)
这很可能是由于字体本身的渲染（你无法与之交互）。您可能想要检查不同浏览器上的行为，因为它可能略有不同。
话虽如此，这里有一个贫民窟的解决方法，你可能会觉得很方便。它涉及使用text-indent属性：
.test {
position:absolute;
left:100px;
top:100px;
font-family:Arial,Helvetica,sans-serif;
font-size:30px;
text-indent:-50px;
}