letter-spacingで文字の間隔を指定する【CSS】

letter-spacingは文字の間隔を指定するプロパティです。

{letter-spacing: 文字の間隔;}

「normal」を指定すると、文字の間隔は調整されないので、フォント標準の間隔になるんですが、単位つきの数値を指定することで、文字の間隔を調整することができます。

letter-spacingの指定方法

letter-spacingプロパティでは単位つきの数値で文字の間隔を指定します。

文字間隔の数値には負の値、つまりマイナスの数値を指定することも可能です。

正の値を指定すると、文字の間隔は広がりますが、負の値を指定すると、文字の間隔は狭くなります。

以下はletter-spacingプロパティを指定した例です。

文字の間隔を10pxにするとこのような感じになります。
文字の間隔を1.2emにするとこのような感じになります。
文字の間隔を1.5remにするとこのような感じになります。
文字の間隔を-2pxにするとこのような感じになります。

あまり意味もなくletter-spacingプロパティをむやみやたらに使うと上記のようになってしまうので、使わないほうがましですが、句読点やカッコの前後の間隔などを微調整する分には便利です。

文字の間隔が標準の場合はこのような感じになります。

全体的には標準が一番です。読みやすい。

全体的な見栄えを考えて文字詰めする場合は、letter-spacingプロパティよりも、font-feature-settingsプロパティのほうが便利かもしれません。