remove
powerd by nog twitter

ORE.CSS 2nd EDITION

HTML解説サイトに必須!文字参照

HTMLドキュメントファイル内において < と > (共に半角)は特別な意味を持ちます。 なぜならこの2つの記号は HTMLタグを記述する際の目印とされるからです。 ご存知の通り<html>であるとか<p>のように英字を < と > で挟んでHTMLタグを表現します。 逆に言うとタグを表す以外の用途で < と > を用いてはなりません。 と、いうコトはですよ、16個の < があれば、16個の > があるはずですし、 <<< のように同一のものが連続するコトも有り得ないわけです、理論的には。

<head>
<h1 class="topword">
大見出し
</h1>

しかし、HTML解説サイトでは上記のようにHTMLタグが無分別に登場してきます。 これらのHTMLタグをコピーしてHTMLドキュメントファイルにペーストしてやればきちんと機能するのに、 説明文として提示されるHTMLタグにはHTMLタグとしての機能がなく、単なる文字列として処理されています。

上記のサンプルソースにおけるHTMLタグは、&lt;head&gt; などと記述された文字列が変換されたものです。 ブラウザが&lt; は <に、&gt; は >に相当すると判断して変換しているわけです。 第一部の CSS解説文書を作成したとき、<html>などとタグを大量に書き込みました。 その際、面倒なので < と > のうち < だけを文字参照で記述して > はそのままキーで打ち込んでソースを構成していました。 これは厳密に考えると、文字参照で記述した < はいいとして(ただの記号として処理される)、 キーボードで直打ちした > は無意味にタグ構成記号が書き込まれているとブラウザに判断されるのでバッドです。 HTML文法チェッカーでは減点されまくりました。


数値文字参照と文字実体参照

数値文字参照文字実体参照
表記変換後表記変換後
&#34;"&quot;"
&#38;&&amp;&
&#60;<&lt;<
&#62;>&gt;>
&#160; (スペース)&nbsp; 
&#165;¥&yen;¥
&#169;©&copy;©
&#174;®&reg;®
&#215;×&times;×
&#247;÷&divide;÷

これらは一例ですが、このように & に続けて規定の文字列を表記するとブラウザがソースを読み込む際に、 対応する記号に変換してくれます。 ブラウザによって、どこまで文字参照に対応しているかは微妙に違うようなので注意が必要です。 ここに列挙したようなものではない特殊記号(ギリシア文字など)に関しては、普遍的には表示されないようです。
参考; HTML4で使える文字実体参照

別に知らなくても良いコトですが、&#lt のように末尾の ;(セミコロン)を書かずとも IE6 なんぞでは普通に表示されます。 しかし、文字参照は & ではじまり ; で終わるというのがブラウザへのサインとなりますから ; も省略せずに記述するのが正しい作法です。 そうは言っても、市販本の中には末尾の ; を省略して文字参照の一覧表を掲載しているモノもある始末。 HTML に関しては市販本もあまり信用できないところが大いにあるので、気をつけるしかありません。


CSS 設計事務所(TOP) / 第二部冒頭 / ハッスルコラム