为什么字母间距并不总是适用于所有字母？

Question

我过去曾在一些@font-face webfonts 上遇到过这种情况。我最近下载了免费的Museo Sans 500 webfont，但在某些字母间距正确时遇到了一些问题，特别是字母 f。调整 CSS letter-spacing 属性时，只要有“f”，它就不会再次应用字母间距，直到“f”后面的第二个字母。

例如：

或者另一个使用单词的例子：

无论如何，我遇到了this site，它也使用该字体，但是在他们网站上弄乱了文本和字母间距时没有任何问题 .

我以前从未创建或编辑过字体，所以我不确定这是否与编辑字体本身有关，或者是否与 @font-face 以及我可以用 css 修复的问题有关.

我已经尝试弄乱我知道的每个 css 字体属性，但似乎没有一个能解决问题。

font-variant-ligatures:
font-kerning: 
letter-spacing:     
text-rendering: 
font-feature-settings: 
font-kerning: 
-webkit-font-smoothing: 
text-size-adjust:
font-size:

我遇到了一个非常漂亮的插件kerning.js，我可以用它来临时解决这个问题，但是对于一个字母来说似乎有点过分了，特别是因为它似乎在我链接的其他网站上也能正常工作早些时候。关于如何用 CSS 解决这个问题的任何建议，还是我必须与字体本身有关>

Answer 1

发生这种情况是因为您的 Museo 版本包含连字，而 Typekit 在其他网站上提供的版本不包含连字。字母“ffi”彼此靠近的原因是因为它是一个连字——三个字母的“绘图”，而不是三个单独的字母。现代浏览器默认开启这些功能。

您应该可以使用 font-feature-settings: "liga" 0; 关闭连字，或者如果您完全不使用它们，更简单的解决方案是使用没有连字的 Museo 版本。