letter-spacing与chrome中的相同浏览器，字体，大小等不同

我的任务是从零开始重写页面的html和css，但达到相同的视觉效果。在尝试匹配两页之间元素的字母间距时，我发现了一个非常奇怪的结果。旧元素是letter-spacing: 0，但要匹配字母间距，我必须将新元素设置为letter-spacing: 0.015em。letter-spacing与chrome中的相同浏览器，字体，大小等不同

老

新

我没有合适的图像编辑软件得心应手超级强加他们ontop的对方，但标签之间交换时（在同一个浏览器上），很明显第一个和最后一个字母在相同的位置，具有相同的字体，字体重量和字体大小。两者都明确声明并计算为font-family: Arial, Helvetica, sans-serif。

但是，在不同字母之间的字母间距是不同的。查看橡胶末端的e和r之间的空间。在我的检查元素中，我已经使所有的事情平等，并且这种变化依然存在。这仅适用于Chrome。其他浏览器中的行为不同于此问题范围之外。

我并不需要将它匹配起来，但我很好奇为什么存在这种行为。量子物理也许？

来源

2016-01-15 Goose

哪个浏览器？它发生在其他浏览器？ –

它在铬。实际上，在其他浏览器中，第一个和最后一个字母不匹配，但我期望。我预计Chrome会在自己内部保持一致。 – Goose

尝试在所讨论的元素上隐式设置字母间距，而不是允许浏览器应用其默认值。你应该看到更多的一致性。 – Korgrue

如果你最终无法修复这个bug（说它是浏览器相关的），并且字母间距必须被发现，你总是可以使用字间库如LetteringJS来给你个人字母间距控制信。我在一些项目中使用它，并没有注意到任何显着的性能命中（仅将它应用于需要有限控制字体的元素）

来源

2016-01-15 18:05:17 Korgrue

letter-spacing与chrome中的相同浏览器，字体，大小等不同

回答

相关问题