CSS3 Pre-Reference



word-spacing

単語間の幅

試す

値を空欄にすると無視されます。

コード

#containe {
    word-spacing: 10px;
}

サンプル

※サポートしていないブラウザでは動作しません。サポートされていない単位(vw、vhなど)でも動作しません。

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

コメントする


対応ブラウザ

Firefox
すべて
Chrome/Safari
すべて
Opera
すべて
InternetExplorer
すべて

パラメータ

[ normal | <長さ> | <パーセンテージ> ] {1,3}
初期値 normal
適用 すべての要素
継承 する
レベル 1-
%の解釈 半角スペース文字の幅を参照
適用メディア Vidual
参考文献 CSS Text Level 3#8.1. Word Spacing: the ‘word-spacing’ property

解説

単語間の幅を指定します。

このプロパティは、CSS3になって大幅に拡張されました。

まず、パーセンテージの指定が可能になりました。次に、3つの値を指定できるようになりました。最小、最大、最適な幅を順に指定します。以下のような扱いになります。

値の数 最小 最大 最適
1 normal normal 指定値
2 指定値 normal 指定値
3 指定値 指定値 指定値

ただ、下位互換性のためと思われますが、「normalの値からの差分」であるという点は変更されていません。値"normal"自体がブラウザ依存のため、この拡張に何の意味があるのかというと、あまり意味がないと言わざるを得ません。

トラックバック

投稿されたコメント