コメントを含むHTMLをコメントアウトする方法（コメントの入れ子）

HTMLコードをコメントアウトする際に、該当部分にすでにコメント（<!-- -->）を含む箇所があると、コメントが入れ子状態になり、意図した表示が得られません。

この問題を回避する方法を調べたので、覚書として残しておきます。

HTMLのコメントのネスト

HTMLにはコメントを入れ子にする方法がありません。しかし、以下の代替手段により、コメントアウト箇所を含むHTMLを実質的にコメントアウトすることができます。

インナーCSSで非表示にする

divタブとインナーCSSで非表示にします。

<div style="display: none">

<!-- コメント -->
<p>テキスト</p>

</div>

＊　この方法の欠点：　サーバーにアップロードする際にファイルサイズを小さくするためにMinify（圧縮）しても、この非表示部分はコメントとして認識されず、削除されない。

styleタグで囲んでから、CSSのコメントアウト記号を使ってコメントアウト

<style></style>タグで囲んたうえで、内部のHTMLコードをCSSのコメントアウト記号を使ってコメントアウトします。

<style>
/*
<!-- コメント -->
<p>テキスト</p>

*/
</style>

scriptタグで囲む

画面に表示されないscriptタグ内にHTMLを書くことにより、コメントアウトと同様の効果が得られます。

<script type="text/plain">

<!-- コメント -->
<p>テキスト</p>

</script>

＊　type="text/plain"を指定することで、scriptとして実行されなくなり、普通のテキストとして扱われます（これは裏技ではなく、公式の仕様です）。

＊　なお、scriptで囲んだうえで、前記のstyleタグを使用する場合と同様に、Javascript用の「/* */」でコメントアウトすることもできます。

＝＝＝＝＝＝＝＝＝＝＝＝＝

上記の各方法を、場合いよって（見やすさなどを考慮して）使い分ければよいと思います。