white-space

テキスト・フォント

要素内の空白文字の処理方法を指定するプロパティです。normal、nowrap、pre、pre-wrapなどがあり、改行やスペースの扱いを制御します。コードブロックの表示やテキストの折り返し制御に重要です。

構文

Syntax

white-space: nowrap;

実行結果

この長いテキストは改行されません

テキストを改行させない

white-space: pre-wrap;

実行結果

空白を保持しつつ 自動改行される

空白を保持しつつ自動改行

.code {
  white-space: pre;
  font-family: monospace;
}

実行結果

function example() {
  return "コードブロック";
}

コードブロックの整形

nowrapは一行表示、pre-wrapはコードの表示に便利。

全ブラウザ対応