<!-- ... --> は HTMLソースの中にコメントを記述します。コメントはブラウザには表示されません。表示はしたくないけれど、ちょっと記述しておきたい注釈(覚え書き)をしておくのに使用します。
<!-- この部分は後でもう少し調べなくっちゃ --> ○○は、○○の略で・・・
コメントは、複数行にまたがってもかまいません。
<!-- コメントは複数行に またがってもかまいません。-->
コメント内にHTMLタグを挟むことも可能です。
<!-- <strong>あいうえお</strong> -->
コメントを入れ子(2重、3重に記述すること)にはできません。下記はコメントの誤った使用例です。
<!-- <strong>あいうえお</strong> <!-- このコメントは入れ子だから駄目 --> <strong>かきくけこ</strong> -->
Internet Explorer では下記のような条件分を記述することが可能です。
<!-- [if IE]> ... <![endif]-->
下記の例のような条件式を指定することができます。
| 条件式 | 意味 |
|---|---|
| [if IE] | IE であれば |
| [if !IE] | IE でなければ |
| [if IE 7] | IE7 であれば |
| [if lt IE 9] | IE9 未満であれば |
| [if lte IE 9] | IE9 以下であれば |
| [if gt IE 9] | IE9 より大きければ |
| [if gte IE 9] | IE9 以上であれば |
| [if (gte IE 5) & (lte IE 8)] | IE5 以上 IE8 未満であれば |
| [if (IE 6) | (IE 7)] | IE6 または IE7 であれば |
| [if true] | 常に真 |
| [if false] | 常に偽 |
HTML 2.0 では、コメントは <! の次に 0個以上のコメントが続き、> で終わるもの。個々のコメントは -- で始まり、-- で終わる。最初のコメントの前にはスペースを入れられないが、個々のコメントの後ろにはホワイトスペース(改行を含む)を入れられると定義されています。
<!-- コメント1 --> <!-- コメント1 -- -- コメント2 -- -- コメント3 -- > <!-- コメント1 -- -- コメント2 -- -- コメント3 -- >
これは、HTML の元になった SGML という規格が以下のような文法で記述され、この定義部を取り除いたものが HTML のコメントとして採用されていることに由来します。
<!定義部 --コメント-- 定義部 --コメント-->
HTML4.0 では、<!-- と --> の間に 2個以上の連続したハイフンを用いることは避けねばならないと説明されています。よく、下記のようなコメントを見ますが、HTML4.0 に正確に従うのであれば、このような使用法は避けた方がよいでしょう。
<!------ 不正なコメント ------>
下記であれば問題ありません。
<!--==== 正しいコメント ====-->
JavaScript を HTML コメント中に記載する場合は、-- 演算子を使用することも禁止されます。
<script> <!-- // この部分はHTMLのコメントなので、 xx--; // -- 演算子を記述することは許されない。 xx -= 1; // これなら大丈夫。 // --> </script>
HTML5 や HTML 5.1 では、<-- で始まり --> で終わるものと定義されています。ただし、テキスト部は > や -> で始まらず、-- を含まず、- で終わらないという条件があります。
<!-- 正しいコメント--> <!--> > で始まっているので不正なコメント --> <!---> -> で始まっているので不正なコメント --> <!-- 間に -- を含んでいるので不正なコメント--> <!-- -で終わっているので不正なコメント--->
HTML Living Standard や HTML 5.2 では、<!-- で始まり --> で終わるもの。ただし、テキスト部は > や -> で始まらず、<-- や --> や --!> を含まず、<!- で終わらないという条件があります。
<!-- 正しいコメント--> <!--> > で始まっているので不正なコメント --> <!---> -> で始まっているので不正なコメント --> <!-- 間に <-- を含んでいるので不正なコメント--> <!-- 間に --> を含んでいるので不正なコメント--> <!-- 間に --!> を含んでいるので不正なコメント--> <!-- <!- で終わっているので不正なコメント<!---->