HTML要素 ・ その他
<!-- -->
コメント（画面に表示されないメモ）
HTMLの中に書く、画面に表示されないメモです。<!-- と --> で囲んだ部分はブラウザに無視されます。
01
サンプルコード
HTML
1<!-- ヘッダー ここから -->
2<header>
3 <p>カフェ・ミモザ</p>
4</header>
5<!-- ヘッダー ここまで -->
6
7<p>表示される文章です。</p>
8<!-- <p>一時的に非表示にしている文章です。</p> -->
02
実行結果
ブラウザでの表示コメント部分は表示されず、「表示される文章です。」だけが見えます
03
解説
<!-- と --> で囲んだ部分は「コメント」になり、ブラウザの画面には表示されません。複数行にまたがって書くこともできます。
コードの区切りや説明を書いておくと、あとから読む自分や他の人が構造を理解しやすくなります。
上の例の最後の行のように、要素をコメントで囲むと一時的に表示しないようにできます（コメントアウト）。
04
応用例・注意点
言語ごとのコメントの書き方
| 言語 | 説明 |
|---|---|
HTML | <!-- コメント --> |
CSS | /* コメント */ |
JavaScript | // 1行コメント ／ /* 複数行 */ |
CSSのコメント
CSSでは /* と */ で囲みます。HTMLの書き方とは違うので注意します。
CSS
1/* ボタンの基本スタイル */
2.btn {
3 padding: 8px 16px; /* 上下 左右 */
4}
注意点
- 01コメントは画面に出ませんが、ページのソースを表示すれば誰でも読めます。パスワードや個人情報は書かないでください。
- 02コメントの中に -- （ハイフン2つ）を書くと、コメントが途中で終わったと解釈されることがあります。
- 03コメントを入れ子にすることはできません。