[CSS] 改行やスペースをそのまま表示する

HTML上の改行やスペースをそのままブラウザ上に表示するには、
CSSの「white-space」を使用します。

構文

構文と指定できる値は以下の通りです。

white-space:＜値＞;

【white-spaceの値】
値	メモ
pre	改行、半角スペース、タブ文字をそのまま表示する。
nowrap	改行、半角スペース、タブ文字を半角スペースに置き換えて表示する。囲われているボックスからはみ出す場合でも自動改行はされない。
normal	改行、半角スペース、タブ文字を半角スペースに置き換えて表示する。囲われているボックスからはみ出す場合は自動改行される。

div.sample{
  white-space:pre;
}

div.sample{

white-space:pre;

}

<div class="sample">
これは
改行して
表示されます。
</div>

これは

改行して

表示されます。

</div>

これは
改行して
表示されます。

brタグを付けなくても改行されていることがわかります。