CSS - word-spacing

概要

説明

単語間の隙間を指定します。文字間の隙間を指定するには letter-spacing を参照してください。

normal

単語間の隙間を自動調整します。(C1/e6/N6/Fx1/Ch1/Op3.5/Sa1)

<length>

単語間の隙間を 1.5em や 10px のような長さの単位で指定します。(C1/e6/N6/Fx1/Ch1/Op3.5/Sa1)

<percentage>

単語間の隙間を通常の文字の幅(1em)を 100% としたパーセントで指定します。CSS4 で追加され、2026年2月の Chrome 145 でサポートされました。

使用例

.sample-normal {
    word-spacing: normal;
    margin: 1em;
    width: 300px;
    border: 1px solid #666666;
}
.sample-length {
    word-spacing: 2em;
    margin: 1em;
    width: 300px;
    border: 1px solid #666666;
}

<h5>normal</h5>
<div class="sample-normal">
We the People of the United States, in Order to form a more perfect Union, establish Justice,
insure domestic Tranquility, provide for the common defense, promote the general Welfare...
</div>

<h5>length(1em)</h5>
<div class="sample-length">
We the People of the United States, in Order to form a more perfect Union, establish Justice,
insure domestic Tranquility, provide for the common defense, promote the general Welfare...
</div>