【HTML】コメントアウトの書き方


HTMLのソースコードの中に、”Webページの画面に表示されないコメント”を書き込んでおくことができます。

これを『コメントアウト』といい、特にタグの説明や注意書きに使います

コメントアウトとは?

コメントアウトとは、プログラム中に書き込める注釈やメモのこと。単に「コメント」ともいいます。

コメントアウトは、単なる説明文なので、プログラムの実行には、一切影響を与えません。

コメントアウトがよく使われるのが、divなどの終了タグの説明

開始タグ(<div>)は、id属性やclass属性が付加されることが多く、複数あっても、それぞれを判断しやすく間違いません。ですが、divの終了タグ(</div>)はすべて同じ

どの終了タグがどのdivに対応するものなのか」の判断がしづらく、間違いやすくなります。間違うと表示が崩れてしまうので大変!

このように、ソースコード上で開始タグと終了タグが極端に離れているような場合に、終了タグの直後にコメントアウトを入れて、対応する開始タグがどれなのか分かるようにしておきます

<div id="body">

</div><!-- /#body -->

以下で、コメントアウトの書き方をご説明します。

スポンサーリンク

コメントアウトの書き方

コメントアウトの書き方は非常に簡単で、コメントアウトさせたい文を「<!--(開始タグ)」と「-->(終了タグ)」で囲むだけ♪

ちなみに、改行してもOK

囲った範囲がコメントとなります。たとえば、次のように書きます。

<!-- コメントアウト -->

<!-- 
コメントアウト 
-->
スポンサーリンク

注意点

記述上の注意点がいくつかあります。

  • 「-(ハイフン)」の数は開始タグと終了タグにそれぞれ2個ずつ
  • コメントの途中で「-(ハイフン)」を入れない

ハイフンの数に注意する

<!--」と「-->」の中には自由にテキストを書き込めます。ですが、複数の「ハイフン(-)」と連続して入れすぎると、そこでコメントの内容が終了していると見なされるで、注意してください。

トラブル回避のためにも、開始タグと終了タグのハイフンは、それぞれ2個ずつにするようにしてください。

以下は悪い例。

<!-------------------- コメント ---------------------------->

ハイフンの場所に注意する

コメントの途中に「-(ハイフン)」が入っていると、ブラウザによっては表示に影響が出る可能性もあるので、コメントの途中でハイフンを入れないようにする。

以下は悪い例。

<!-- コメント--コメント -->
スポンサーリンク
ページ先頭へ