letter-spacingプロパティ
letter-spacing : 値 |
letter-spacingプロパティは、文字の間隔を指定します。
値 | 説明 |
---|---|
数値 + 単位 | 指定した単位で設定します。 |
normal | 通常の間隔にします。(初期値) |
値を継承する |
- 数値+単位にした場合、文字の間隔に指定した数値+単位のスペースを追加します。
- 以下はMDNのletter-spacingプロパティのリンクです。
https://developer.mozilla.org/ja/docs/Web/CSS/letter-spacing
文字の間隔を指定するサンプルです。
標準の間隔
<style>
#p1 {
letter-spacing: normal; /* 標準の間隔 */
border: 1px solid #000;
width: 400px;
height: 30px;
background: LightCyan;
}
</style>
<p id="p1">文字の間隔normalです</p>
間隔に5pxを指定
<style>
#p1 {
letter-spacing: 5px; /* 5pxを指定 */
border: 1px solid #000;
width: 400px;
height: 30px;
background: LightCyan;
}
</style>
<p id="p1">文字の間隔5pxです</p>
間隔に20pxを指定
<style>
#p1 {
letter-spacing: 20px; /* 20pxを指定 */
border: 1px solid #000;
width: 400px;
height: 30px;
background: LightCyan;
}
</style>
<p id="p1">文字の間隔20pxです</p>
関連の記事
CSS word-spaceing 単語の間隔を指定する
CSS overflow-wrap 単語が表示域を超える時の改行
CSS overflow はみ出た部分を表示する/しない