CSS：如何禁用字体的字距调整？

Question

如何禁用字体的字距调整？

Answer 1

请参阅维基百科中的字距调整概念。

字距调整不受字母间距控制，CSS1 或 CSS2 没有

font-kerning

。新规范 CSS3 尚未被批准为标准（W3C 建议），但有一个针对

font-kerning

提出的属性，请参阅 2012 年草案，

http://www.w3.org/TR/css3-fonts/#font-kerning-prop

只有特定字体，例如 OpenFonts，具有此属性。

即使使用无字距调整控制，使用非零字母间距也可以改变“人类字距调整感知”，产生“停用字距调整”效果。示例：使用

letter-spacing:-0.1em

增强字距调整，使用

letter-spacing:0.5em

缩小字距调整。

使用 CSS1

letter-spacing

属性，您可以 lost 或 enhance 字距调整感知，并且进入“字母间距文本”，您可以 模拟字距调整：

<div style="font-size:20pt;background-color:#bcd">

  VAST   <small>(normal)</small> 
  <br/>

  <span style="letter-spacing:-0.1em">VAST</span>  
  <small>(enhance perception)</small>
  <br/>

  <span style="letter-spacing:0.5em">VAST</span> 
  <small>(lost perception)</small>
  <br/>

  <!-- SIMULATE KERNING AT SPACED TEXT -->
  <div style="letter-spacing:6pt">
     SIMULATE: <span style="letter-spacing:4pt">VA</span>ST TEXT
  </div>

</div>

请参阅此处上面的示例。

Answer 2

使用letter-spacing属性

<style>
.kern
{
    letter-spacing: 10px;
}
.nokern
{
    letter-spacing: 0px;
}
</style>
<div id="div1" class="kern">
    test test test test
</div>
<div id="div2" class="nokern">
    test test test test
</div>

Answer 3

CSS 使用 letter-spacing 属性控制字距调整。尝试将其设置为 0 以将字体恢复为正常字偶距。

p { letter-spacing: 0; }

Answer 4

我不知道这是否完全可能，但你可以尝试查看 letter-spacing 属性。

Answer 5

尝试

text-rendering: optimizeSpeed

，这至少会在我的浏览器上禁用字距调整。

也就是说，

"VA".width == "V".width + "A".width

。

letter-spacing

不会禁用字距调整，“VA”仍然比“V”+“A”短。

所以，尝试

text-rendering

。虽然它的文本渲染效果更差，但它确实禁用了字距调整。

Answer 6

您可以在要关闭字距调整的字符之间插入零宽度空格。

https://en.wikipedia.org/wiki/Zero-width_space