ITメモ
HTML
外部Link
【HTML ドキュメント】MDN Web Docs(Mozilla)
「HTML」リファレンス
HTMLメールの作り方「指定キーワード」を検索した「Google検索結果ページ」への「リンク」を作る方法「Google Map」へ「リンク」を作る方法「HTMLタグ」に「マウスアクション」を指定する方法「HTML」で「空白」を表示する方法「HTML」で「タブ(空白)」を表示する方法【XML】サイトマップ作り方
「HTML」の基礎知識
「HTML」の書式「HTML」でのコメントの仕方「HTML」での「改行」の仕方「CSS」の使い方「Javascript」の使い方「HTMLタグ」の使い方「HTML」の特殊文字一覧ブラウザやタブに表示される小さなアイコン「favicon(ファビコン)」の作り方他のページに移行する「リンク」の作り方 表の作り方Webページに画像の埋め込む方法動画を埋め込む方法音声ファイルを埋め込む方法地図を埋め込む方法入力フォームの作り方
「HTML」タグ
【DOCTYPE】「HTML」の「DOCTYPE宣言」【html】すべての「HTMLタグ」の親要素「html」タグ【head】「Webページ」の付属情報を設定する場所【meta】「Webページ」の設定をする「HTMLタグ」【title】「Webページ」の「タイトル」を設定する「HTMLタグ」【link】外部ファイルとの関係定義や読み込みをする方法【script】「Javascript」を実行する方法【div】レイアウトの枠として使う方法【p】文章の段落ごとに区分する方法【li】リスト(箇条書き)で表示をする方法【table】表の作り方【br】「HTML」での「改行」の仕方【a】リンクの作り方【h1-h6】Webページの見出しの設定方法【img】画像を表示する方法【span】文字列の一部を装飾する方法【ruby】「ルビ」をふるための要素
SEO(Search Engine Optimization)
「SEO対策」の具体的な方法「検索エンジン」に登録する方法「SEO対策」に有効な「ページタイトル」の記述方法「SEO対策」に有効な「キーワード」の記述方法「SEO対策」に有効な「ディスクリプション」の記述方法





【HTML】「HTML」「CSS」でのコメントの仕方

【HTML】
「HTML」「CSS」でのコメントの仕方




「HTML」コメントは、
HTMLファイルに記述しても、
Webページに表示されないようにしてくれるHTMLコードの書式。
コメントの書き方は、「<!--」「-->」で囲むことで、
間の文字などはコメントとして表示されなくなります。

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

1行だけでなく、
間にあれば、複数行のコメントも記述可能です。









「HTML」コードでのコメントの仕方


「HTML」コードで使えるコメントの方法は、1種類「<!-- コメント内容 -->」。

コメントとは、Webには表示させたくないが、製作上のメモを残したいときなどに利用するもので、 コメントの記述方法で入力をすれば、Webには表示されず、HTMLドキュメントにメモを残すことができる。
製作段階で、区分するラインなどを作成することもできるので、良く利用される。

プログラミング言語ごとにコメントの記述方法は異なるが、 HTMLの場合は、「<!--」と「-->」の間にコメント内容を記述することになっていて、 複数行にわたって囲い込んでもコメントとなる。
長い分での解説もコメントとして隠すことができるので、共同開発などしているときは便利。



通常のコメント
<!--コメント内容 -->

複数行のコメント
<!--
コメント内容
コメント内容
コメント内容
コメント内容
コメント内容
-->


コメントで作るライン
<!-- *************************** -->
<!-- ============== -->
<!-- -------------------------- -->
<!-- ||||||||||||||||||||||||| -->



Back



「HTML & CSS」のコメント書式の違い


コメントアウトの方法は、各プログラム言語によって書式が異なる。


プログラムコメントの書式
HTML <!--1行コメント -->

<!--
複数行コメント
複数行コメント
複数行コメント
-->
CSS /* 1行コメント */
/*
複数行コメント
複数行コメント
*/
Javascript //1行コメント

/* 1行コメント */

/*
複数行コメント
複数行コメント
複数行コメント
*/
PHP //一行コメント
/* 一行コメント */

/*
複数行コメント
複数行コメント
複数行コメント
*/


Back



「CSS」コードでのコメントの仕方


「CSS」のコメント方法は、1種類「/* コメント内容 */」。

コメントは、プログラムを記述する中で、目印や説明文を残したいが、
プログラムへ影響をさせたくない文を除外(コメントアウト)する時に使う手法。

「CSS」のコメントは、「/*」と「*/」の間に記述することが決まっていて、
コメントの書き方は、各プログラムによって異なります。

コメントは、色々と利用ができて、かなり便利です。
  • コメント
  • CSSコードのカテゴリー分け
  • エラー検出


コメントの記述例


シンプルなCSSコメント

/* コメント文 */
h1 { color: red; }


エラー確認のために使うコメント

h1 {
margin:0 10px 20px 30px;

/*
padding:5px 20px;
color: red;
*/

}
上記のように、コメントでエラーのブロックを隠し、一つずつコメントからはずすことで、正常に機能しないエラーを探す。


コメントで区分ラインを作る方法
/*---------------------------*/
/*+++++++++++++++++++++++++++*/
/*///////////////////////////*/

カテゴリを分けて、CSSを記述するときなど、コメントでラインを作って区分すると便利。



Back