CSS 単語の間隔を指定するサンプル(word-spaceing)

CSSの単語の間隔を指定するサンプルです。
word-spaceingプロパティを使用します。

word-spaceing プロパティ

word-spaceing : 値
説明
数値 + 単位 指定した単位で設定します。
normal 通常の間隔にします。(初期値)
値を継承する

コード

word-spaceingのサンプルのコードです。

<style>
#p1{
	background-color:LightCyan;
	word-spacing:normal;
}
#p2{
	background-color:Cornsilk;
	word-spacing:5px;
}
#p3{
	background-color:LightCyan;
	word-spacing:20px;
}
#d1 p{border:1px solid #000;width:300px;height:30px;
margin-bottom:10px;text-indent:10px;}
</style>
<body >
<div id="d1">
<p id="p1">word spacing normal</p>
<p id="p2">word spacing 5px</p>
<p id="p3">word spacing 20px</p>
</div>
</body>

サンプル

上記コードのサンプルです。

word spacing normal

word spacing 5px

word spacing 20px

関連の記事

CSS 文字の色を指定するサンプル(color)
CSS フォントを指定するサンプル(font-family)
CSS 文字を左寄せ/右寄せにするサンプル(text-align)
CSS 文字の垂直の位置を指定するサンプル(vertical-align)
CSS 行の高さを指定するサンプル(line-height)
CSS 文字の間隔を指定するサンプル(letter-spacing)
CSS 単語が表示領域を超える場合の改行方法(overflow-wrap/word-wrap)
CSS 表示領域を超える場合の表示方法(overflow)
CSS 文字に線を引くサンプル(text-decoration)



△上に戻る