Simple HTMLHTMLリファレンス

Main Menu

おすすめリンク

Site Info.

CSSプロパティ

HTMLリファレンス

CSSリファレンス

その他の記事

CSSリファレンス インデックス

スポンサーリンク

CSSリファレンス

TEXTテキストTOPCSSPropertiesText

  1. colorテキストの色
  2. directionテキストの記述方向
  3. letter-spacingテキスト文字の間隔
  4. text-alignテキストの横方向の位置揃え
  5. text-decorationテキストの装飾
  6. text-indentテキストのインデント距離の指定
  7. text-transformテキストの大文字化と小文字化
  8. unicode-bidiUnicodeの文字方向の制御
  9. vertical-alignテキストの縦方向の位置揃え
  10. white-space半角スペース・タブ・改行の扱い
  11. word-spacing単語間の半角スペース幅

white-space半角スペース・タブ・改行の扱い

プロパティの値normal | pre | nowrap | pre-wrap | pre-line | inherit
初期値normal
対象要素全要素
継承する
%無効
メディアvisual
W3C Ref.CSS2.1CSS3

プロパティの書式と機能

white-spaceプロパティは、要素内で表示するテキスト内の連続する半角スペースの表示方法や、改行の方法を指定します。自動改行されない値(preまたはnowrap)を指定した場合にはみ出すテキストの表示方法は、overflowプロパティで指定することができます。

空白文字と改行の扱いを表にまとめると、次のようになります。

プロパティの値連続する空白文字の扱い自動改行ソースコードの改行<br />タグ
normal1文字として扱う×
preソースコードの記述通り×
nowrap1文字として扱う×
pre-wrapソースコードの記述通り
pre-line1文字として扱う

プロパティの値

white-space: normal

複数の連続する空白文字やタブは半角1文字分として扱われ、行ボックスの端では自動改行されます。<br />要素による任意改行も有効です。

white-space: pre

複数の連続する空白文字はそのまま表示されますが、自動改行は行われません。ソースコード内のテキスト改行が反映される他、<br />要素による任意改行も有効です。<pre>要素と同様の表示が行われます。

white-space: nowrap

基本的にはnormalと同じですが、空白文字での自動改行が行われません。ソースコード内のテキスト改行が反映される他、<br />要素による任意改行も有効です。

white-space: pre-wrap

preに加え、空白文字での自動改行が行われます。

white-space: pre-line

normalに加え、ソースコード内のテキスト改行が反映されます。

スポンサーリンク
Copyright (C) 2010 Simple HTML. All Rights Reserved.