html - Arial 字体只用大写字母间距做一些奇怪的事情

Question

“A”、“C”和“T”之间的间距比其他字母之间的间距宽。是什么原因造成的，我该如何解决？

<main class="container">
  <div class="body wide">
    <header role="banner" class="banner">
      <h1 class="js-quickedit-page-title">
        <span property="schema:name">Activiteiten</span>
        </h1>
    </header>

这是我的元素检查:

JSFiddle:https://jsfiddle.net/v9qwo93g/1/

不确定我是否必须发布更多代码 html/css，如果需要我会发布!

Answer 1

只是字体本身似乎具有这种不一致的字母间距。在文本编辑器中查看，它甚至不必是粗体:

在图像上，您会看到在 Paint 中编辑的 Arial(非粗体)。两条红线的粗细相同。

在您的示例中，由于小字体和舍入问题，它变得更糟。除了使用另一种字体外，我看不到解决此问题的方法。如果您对这个话题感兴趣，在 graphicdesign.SE 上询问一些专家时，您可能更有机会获得更深入的见解。或类似页面。