preタグの使い方

preタグ

pre要素内を整形済みテキストとして表示します。空白や改行もそのままの状態で表示します。

pre要素

カテゴリ 文字装飾
タグ <pre>
機能 空白、改行などを入力されたままに表示します。
属性
preタグの使用例
<pre> ~ </pre>

preタグの説明

pre要素内のテキストを整形済みとして表示します。整形済みとは空白や改行などをそのまま表示することです。

どんな時に使用するのでしょう?たとえば音楽の歌詞や川柳・五七五などの詩・プログラムのソースコードなど、空白も含めた一つの表現として、表示したい時に使用することが多い。

下の例では全角スペースを入れて文章の間隔を空けています。
<pre>
   preの説明   preの説明
       preの説明
</pre>

このように空白や改行も入力したまま表示します。