HTML STUDY

文字の間隔

ここではCSSで文字と文字の間隔を設定する方法を解説していきます。文字の間隔を設定するにはCSSプロパティletter-spacingを設定します。

letter-spacing

CSSプロパティletter-spacingを設定して文字の間隔を設定していきましょう。letter-spacingに入力する値にはnormalか数値(px値、em値など)を設定します。キーワードのnormalは初期値となります。

CSSプロパティ解説
letter-spacing文字の間隔

HTMLコード記述例

<p class="letter-normal">初期値の文字間隔はこんな感じ。</p>
<p class="letter-10px">文字間を10px離すとこんな感じ。</p>

外部ファイルCSS記述例

@charset "utf-8";

p.letter-normal { letter-spacing: normal;}
p.letter-10px { letter-spacing: 10px;}

ブラウザ表示例

初期値の文字間隔はこんな感じ。

文字間を10px離すとこんな感じ。

CSS文字 関連記事