HTML & CSS

HTMLのコメント表記について

  1. 最終更新日:
  2. 公開日:

HTMLのソースコードにメッセージを残したり、マークアップを無効にするコメントの表記について解説します。

この記事のポイント

  • HTMLのコメントの記載方法と用途が分かる

HTMLのソースコードにコメントを記述する

HTMLにはCSSやプログラミング言語と同じように、ソースにコメントを記述することができます。
主な用途はメッセージを残す、またはマークアップを無効にする(コメントアウトと呼ばれます)用途で使用します。

開始タグである「<--」と、終了タグの「-->」で囲まれた箇所がコメントとなります。

HTML コード例

<!-- 2018.07 追記 -->
<section>
	<article>
		<p>サンプルテキストです。</p>
	</article>
	<!--
	コメントでHTMLを囲むと無効にできる
	<article>
		<p>サンプルテキストです。</p>
	</article>
	-->
</section>
<!-- //2018.07 追記終了 -->

コメントは1行でも、複数行でも同じ形式で記述することができます。
ただし、コメントの入れ子はできません。

HTML コード例

<!--
	<!--
	コメントの入れ子はできないので、このコメントは無効
	<article>
		<p>サンプルテキストです。</p>
	</article>
	-->
</section>
-->

コメントを書くコツは、自分以外の人が読んでも意図を汲み取れる内容で書くことと、できるだけ短く書くようにすることです。

また、コメントアウトによるHTMLの無効化(非表示)はソースを削除しないで編集したいときに便利ですが、ソースコードが複雑になってしまうため注意してください。

記事一覧