<pre> ソースを整形済みテキストとして表示する
| 取り扱い | 現行の標準 |
| カテゴリ |
フロー・コンテンツ パルパブル・コンテンツ |
| 親にできる要素 | フロー・コンテンツを受け入れる要素 |
| 子にできる要素 | フレージング・コンテンツ |
| 対応ブラウザ | caniuseで確認 |
<pre>タグの説明
<pre>は、このこの要素で囲まれた文字列を整形済みテキスト（preformatted text）として扱います。具体的には、ソースコードの編集画面で見えている改行や空スペースが、そのまま反映されます。
整形済みテキストと言っても、完全なプレーンテキストとして表示される訳ではありません。例えば、HTMLのタグを構成する「<」や「>」はそのまま解釈されてしまうので、「<」や「>」と記述しなければなりません。このようなルールは、特殊記号を表すエンティティで解説しています。
<pre>タグの特徴
- レイアウトの初期値はブロックレベルです。文章の改行に影響を与えます。
- 視覚的な効果は特に与えられません。必要に応じてスタイルシートを調整して下さい。
- 同一のページ内に複数使うことができます。ただし、この要素自体を入れ子にすることはできません。
<pre>に指定できる主な属性
- グローバル属性
- 全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。
- イベントハンドラ
- 全てのHTML要素に指定できるコンテンツ属性です。
<pre>の使い方とサンプル
このタグを使ったマークアップのサンプルです。
HTML
<pre>
改行や スペースを
そのまま 表示します。
</pre>
表示確認
改行や スペースを そのまま 表示します。
HTML
<pre>
HTMLのタグを表すには、<html>と書きます。
</pre>
表示確認
HTMLのタグを表すには、<html>と書きます。