html - 第一个字母 CSS 上的左空格

Question

我使用的是 Google 字体“Lato”，我在将标题和文本正确左对齐时遇到问题...字体(大时)似乎在第一个字母上有一个紧排空间并且不会左对齐没有空间!？

所以这里还有一个 fiddle :

<h1>Hello</h1> <p>Hello, this is sentance</p>

FIDDLE

此外，在左边距上添加一个负值(magin-left:-10px)似乎是一个糟糕的解决方法......这对于不同的字体大小来说总体上不起作用，除非根据需要单独调整...... . 一定有更好的解决方案吗？

有人能帮忙吗？

Answer 1

好吧，所有说这是由于自动填充或由于该行是标题而导致的边距的人都是错误的。将此 fiddle 视为证据:

http://jsfiddle.net/w25j9L7o/26/

前导空格未由浏览器或 CSS 或 DOM/浏览器级别的任何其他内容呈现。它是字体。 H 字形周围有一些内置填充，字体越大，填充就越明显。

即使您使用负边距来补偿:

1. Angular 色本身在移动，其中包括空白区域，因此空白区域也会滑动，影响布局。可见字符不会滑入空白区域，如果您使用 CSS 修复它，整个字符(可见和不可见)会向左移动。

2. 您需要根据字体大小调整偏移量或计算出基本百分比，以便偏移量随着任何字体大小设置而增加。

或者您可以使用不具有此特性的不同字体。