white-space CSS2.2CSS3

white-space は、空白や改行の扱いを指定する時に使います。

名前	:	white-space
値	:	normal \| pre \| nowrap \| pre-wrap \| pre-line
初期値	:	normal
適用対象	:	全ての要素
継承	:	する
パーセンテージ	:	n/a
メディア	:	visual（視覚的）
計算値	:	As specified（指定通り）
正規順序	:	n/a
アニメーション	:	discrete（離散的）

Value（値）

normal: 初期値半角スペース・タブ・改行を半角スペースとして表示して自動改行する。
pre: 半角スペース・タブ・改行をそのまま表示。
nowrap: 半角スペース・タブ・改行を半角スペースとして表示して自動改行しない。
pre-wrap: 半角スペース・タブ・改行をそのまま表示。ボックスの端で自動改行する。
pre-line: 半角スペース・タブ・改行を半角スペースとして表示して、文書内で改行された位置でも改行する。

HTML source

<!DOCTYPE html>
<html>
 <head>
  <title></title>
  <style>
   p.test1 { white-space: normal; }
   p.test2 { white-space: pre; }
   p.test3 { white-space:nowrap; }
   p.test4 { white-space:pre-wrap; }
   p.test5 { white-space:pre-line; }
  </style>
 </head>
 <body>
   <p class="test1">normal normal          normal
   normal</p>
   <p class="test2">pre pre                pre
   pre</p>
   <p class="test3">nowrap nowrap          nowrap
   nowrap</p>
   <p class="test4">pre-wrap pre-wrap                pre-wrap
   pre-wrap</p>
   <p class="test5">pre-line pre-line                pre-line
   pre-line</p>
 </body>
</html>

display

normal normal normal normal

pre pre pre pre

nowrap nowrap nowrap nowrap

pre-wrap pre-wrap pre-wrap pre-wrap

pre-line pre-line pre-line pre-line

white-space CSS4

white-space プロパティは「text-space-collapse」「text-wrap」「text-space-trim」の省略形です。（css4からは3つに分解されて、white-space プロパティは省略形として扱われるようです。）

名前	:	white-space
値	:	normal \| pre \| nowrap \| pre-wrap \| pre-wrap-auto \| pre-line
初期値	:	auto
適用対象	:	全ての要素
継承	:	する
パーセンテージ	:	n/a
メディア	:	visual（視覚的）
計算値	:	As specified（指定通り）
アニメーション	:	できない

次の表は省略形の値を省略されていないプロパティの値にマッピングしたものです。

white-space	text-space-collapse	text-wrap	text-space-trim
normal	collapse	normal	none
pre	preserve	nowrap	none
nowrap	collapse	nowrap	none
pre-wrap	preserve	normal	none
pre-wrap-auto	preserve-auto	normal	none
pre-line	preserve-breaks	normal	none