整形済みテキスト(<pre>)

<pre>タグは整形済みテキストを表します。

<pre>
要素の形式
<pre>contents</pre>
DTD
Strict
Transitional
Frameset
XHTML 1.1
XHTML Basic
要素の種類
ブロックレベル要素

文書の中に含まれる連続する空白や改行などは通常無視されて表示が行われますが、<pre>から</pre>で囲まれた要素は記述された文書がそのまま表示されます。また使用されるフォントは等幅フォントが使われます。

<pre>タグを使った要素の形式は以下の通りです。

<pre>
#include <stdio.h>

int main()
{ 
    printf("hello, world¥n");
    return 0;
}
</pre>

空白が多く含まれるソースコードや文字を使って図を描いている場合などは、空白や改行を特殊文字で1つ1つ置き換える代わりにpre要素を使用することで簡潔に記述することが可能となります。

なおpre要素内であっても「<」や「>」「&」などはそれぞれ「&lt;」「&gt;」「&amp;」で置き換えて記述する必要があります。また文書に含まれる1行の幅がブラウザの幅を超えてしまっても自動的には改行されませんので注意して下さい。

属性

指定可能な属性は以下の通りです。

[属性] width

属性説明
width
(非推奨)
表示幅幅を文字数で指定

※ Transitional 及び Frameset のみ使用可能

width属性は表示幅を文字数で指定します。実際には次のように使用します。

<pre width="80">
#include <stdio.h>

int main()
{ 
    printf("hello, world¥n");
    return 0;
}
</pre>

非推奨属性の為、幅についてはスタイルシートで設定するようにして下さい。

サンプル

では簡単なHTML/XHTML文書を作成して試してみます。

sample3-1.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>整形済みテキスト(<pre>)</title>
</head>
<body>

<p>
ここから下が整形済みテキストです。
</p>
<pre>
#include <stdio.h>

int main()
{ 
    printf("hello, world¥n");
    return 0;
}
</pre>
<p>
整形済みテキストはこの上までです。
</p>

</body>
</html>

表示結果は以下の通りです。

IE7

整形済みテキスト(<pre>)

FireFox3

整形済みテキスト(<pre>)

子要素として持つことができる要素一覧

<p>タグを使った要素が子要素として持つことができる要素は次の通りです。

※インライン要素であってもfontやimgなど一部の要素は子要素の内部も含めて持つことが出来ません。

※HTML4.01のTransitionalとFramesetではiframeも子要素として持てます。

ブロックレベル要素:

タグSTRTRAFRAX1.1XBa
address----------
blockquote----------
center----------
dir----------
div----------
dt----------
fieldset----------
form----------
h1(~h6)----------
hr----------
isindex----------
menu----------
noframes----------
ol----------
p----------
pre----------
table----------
ul----------

インライン要素:

タグSTRTRAFRAX1.1XBa
a
abbr
acronym
applet----------
b--
basefont----------
bdo--
big----------
br
button----
cite
code
dfn
em
font----------
i--
iframe------
img----------
input----
kbd
label----
map--
object----------
q
ruby----------
s------
samp
select----
small----------
span
strike------
strong
sub----------
sup----------
textarea----
tt--
u------
var
テキスト

その他の要素:

タグSTRTRAFRAX1.1XBa
area----------
base----------
body----------
caption----------
col----------
colgroup----------
dd----------
del--
dt----------
frame----------
frameset----------
head----------
html----------
ins--
legend----------
li----------
link----------
meta----------
noscript----------
optgroup----------
option----------
param----------
rb----------
rbc----------
rp----------
rt----------
rtc----------
script--
style----------
tbody----------
td----------
tfoot----------
th----------
thead----------
title----------
tr----------

(STR:Strict, TRA:Transitional, FRA:Frameset, X1.1:XHTML 1.1, XBA:XHTML Basic)

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。