pre 要素 (HTML)

[1] HTML の pre 要素は、囲まれた文が整形済み (preformatted) であることを視覚UA に伝えます。

仕様書

[33] HTML Standard (2016-04-24 23:36:04 +09:00 版) https://html.spec.whatwg.org/#htmlelement

[9] 仕様書:

HTML 2.0: RFC 1866 5.5.2. Preformatted Text: PRE
SI 4281:1998
- 6.1.1.2 Pre-formatted segments http://www.qsm.co.il/Hebrew/si4281e.htm
HTML 4
XHTML 1.0: IW:XHTML1.0:"#prohibitions"

必須

必須

(%inline;)* -(除外要素型)

出現できる文脈

%block; な文脈 (歴史的変遷 https://suika.suikawiki.org/www/2004/html/content-pre)

属性

属性名	属性値	既定値	説明	出典
`align`			揃え	[HTML4] 非推奨
`autohilite`				非標準	Microsoft
`class`			級	[HTML4] %coreattr
`cols`				非標準
`dir`			書字方向	[HTML4] %i18n
`id`			一意識別子	[HTML4] %coreattr
`lang`			自然言語	[HTML4] %i18n
`xml:lang`			自然言語	[XHTML1]
`onclick`				[HTML4] %events
`ondblclick`				[HTML4] %events
`onkeydown`				[HTML4] %events
`onkeypress`				[HTML4] %events
`onkeyup`				[HTML4] %events
`onmousedown`				[HTML4] %events
`onmouseout`				[HTML4] %events
`onmouseover`				[HTML4] %events
`onmouseup`				[HTML4] %events
`_moz_quote`				非標準	Mozilla
`style`			スタイル情報	[HTML4] %coreattr
`title`			注釈的題	[HTML4] %coreattr
`width`	`NUMBER`	(自動)	幅	[HTML 2.0], [HTML 4] 非推奨
`wrap`				非標準
`xmlns`	`http://www.w3.org/1999/xhtml`		W3C 勧告	XHTML 1

内容模型

[4] 内容としては、基本的に行内要素を持つことができますが、

img *
object *
applet
big *
small *
sub *
sup *
font
basefont

は除外されています (子孫要素とできません)。

HTML 4 によれば、この規定は HTML 3.2 と同じで、固定幅フォントでレンダリングしたときに行の高さと文字の進み幅が一定になるようにするための制約なのだそうです。

XHTML 1.0 にもこの制約は受け継がれています XHTML 1.0 http://www.w3.org/TR/xhtml1/#prohibitions。ただし、 * をつけた要素にしか言及されていません。残りの移行用要素型はどうでもいいってことですか。 (XHTML 1.0 にも Transitional DTD はあるのにねぇ。)

[5] >>4 の目的の達成のためには、 >>3 の bidi についての規定が邪魔に思えるのですけどねぇ。

[13] pre の内容には各種の行内要素が使えますが、 UA の性能によっては、正しくレンダリングされないことがあります。 RFC 1866 5.5.2.

太字でレンダリングした部分で文字幅の計算がずれてまわりと字が重なるとか、そんなような状況を想定しているのだと思われます。

レンダリング

[3] HTML 4 によれば、

視覚 UA は、
- 空白に手をつけなくてよい (may)
- 固定幅フォントで文をレンダリングしてもよい (may)
- 自動語折り返し (word wrap) を無効化してもよい (may)
- bidi 処理を無効化してはならない (must not)
非視覚 UA は、余分な空白を尊重する必要はない (not required)

[6] >>4 の除外要素があるのは、固定幅フォントで表示したときに行の高さや文字の幅が一定になるようにするためです。この動作を著者がスタイルシートで変えてしまうことは非推奨 (discourage) です。

[10] RFC 1866 では、 pre 要素は固定幅フォントで整形された文章に適当な要素型であると紹介していました。 RFC 1866 には明記こそされていませんが、固定幅フォントでの表示が適当であると言っていることは自明です。

[11] UA は width 属性値を参考にして適当な文字の大きさと字下げの量を決めることができます。 RFC 1866 5.5.2. 幅が広ければ左余白を削減するようなことを想定しているようです。

[16] pre の意味は整形済み文であって、固定幅ではありませんが、歴史的事情を考慮すれば、非固定幅な整形済み文に使用するのは好ましくないでしょう。 (しかしそうなると、非固定幅な整形済み文に使用するべき要素型がなくなってしまいますが・・・。)

[19] pre 要素のスタイル定義とマークアップ - 2xup http://2xup.org/log/2006/09/07-0056 (名無しさん 2006-09-07 00:02:14 +00:00)

改行

[12] pre 内では、改行を改行 (次の行の先頭への移動) として扱います。 (表示領域の先頭ではなく、余白を考慮した行の先頭です。) RFC 1866 5.5.2.

[14] 古い文書は pre の中で p タグを使っています。 UA はこれを改行と同じように扱うことが推奨 (encourage) されていました。ただし、 p の後に改行が続く時には、まとめて一つ分の改行とみなすべきとされていました。 RFC 1866 5.5.2.

[17] Bidi: bidi に関しては、行ごとに bidi 算法を適用して各文字の表示位置を決定します SI 4281 6.1.1.2。

水平タブ

[8] かつて、水平タブ文字 (0/9, HORIZONTAL TAB, HTAB) を pre 内で使用することは避けるべきとされていました。

[22] HTML 2.0 (RFC 1866) では含めるべきではない (should not) 、 HTML 4 では強く非推奨 (strongly discouraged) 、 ISO-HTML では使用不能 (強制的に SP に変換) と、時代が下るにつれ強い表現になっていました。

[23] UA はタブを8の倍数の文字位置までの分の間隔として解釈しなければなりません。しかし実装は一貫していません。 RFC 1866 5.5.2.

[24] 多くの視覚 UA は、8文字を一タブ幅としています。ところが、 editor でタブ幅を好きな幅にすることはよく行われています。だから、変てこな文書を作ってしまうことになります。 HTML 4

[9] 多くのブラウザが8タブを採用しているのは事実で、ブラウザに限らずとも8文字が優勢ですが、そうでなかったり、設定で変えられる処理系も多々あります。水平タブ文字は、数ある C0 制御文字のうちでは、文字自体はかなり安全に (ほとんど必ず) 伝達してもらえるわずかな文字の一つではありますが、意図した通りに表示してもらえる確率はかなり低くなりますから、この判断は妥当だとも思われました。

[25] HTML5 ではこの種のレンダリングに関わる制約はなくなり、CSS などレンダリング・モデルに解釈を委ねています。 pre 要素の既定のレンダリングで適用される white-space: pre は、 CSS 2.1 によると、8タブでレンダリングされます。

http://www.w3.org/TR/CSS21/text.html#white-space-model

例

[15] 整形済み文の例 RFC 1866 5.5.2.

<PRE>
Line 1.
       Line 2 is to the right of line 1.     <a href="abc">abc</a>
       Line 3 aligns with line 2.            <a href="def">def</a>
</PRE>

[7] Shelly の詩『To a Skylark』 HTML 4

<PRE>
       Higher still and higher
         From the earth thou springest
       Like a cloud of fire;
         The blue deep thou wingest,
And singing still dost soar, and soaring ever singest.
</PRE>

レンダリング例:

       Higher still and higher
         From the earth thou springest
       Like a cloud of fire;
         The blue deep thou wingest,
And singing still dost soar, and soaring ever singest.