すべてのウェブサイトは、構造（HTMLで指示される）、機能、および文体的要素で構成されています。カスケードスタイルシート（CSS）は、ウェブサイトの外観（「ルックアンドフィール」）を指示するために使用されます。これらのスタイルはHTML構造とは別に保持されており、Web標準への更新や遵守を容易にします。
スタイルシートの問題
今日の多くのウェブサイトのサイズと複雑さにより、スタイルシートはかなり長くて面倒になることがあります。これは特に、応答性の高いウェブサイトスタイルのメディアクエリがデザインに不可欠な要素となり、デバイスに関係なくウェブサイトが見えるようになりました。これらのメディアクエリだけでは、CSSドキュメントにかなりの数の新しいスタイルが追加されるため、作業がさらに難しくなります。これはCSSのコメントがウェブサイトのデザイナーや開発者にとって貴重な助けになる場所です。
コメント構造と透明度を追加する
ウェブサイトのCSSファイルにコメントを追加すると、そのコードのセクションを整理して、ドキュメントを閲覧している人間の読者を探すことができます。また、あるWebプロフェッショナルが別のWebプロフェッショナルが休暇を取る場所を選ぶとき、またはチームのチームがサイトで働くときに、一貫性を保証します。
フォーマット済みのコメントは、すでにコードに精通していないチームのメンバーにスタイルシートの重要な側面を伝えることができます。これらのコメントは、以前にサイトで作業したことがある人にとっては非常に役立ちますが、最近ではありません。 Webデザイナーは、通常、多くのサイトで作業し、デザイン戦略を覚えておくのは難しいです。
専門家の目のみ
Webブラウザでページがレンダリングされると、CSSコメントは表示されません。これらのコメントは、HTMLのコメントと同じように情報だけです（構文は異なりますが）。これらのCSSコメントは、サイトのビジュアル表示には何ら影響しません。
CSSコメントの追加
CSSコメントを追加するのは簡単です。あなたは単にあなたのコメントを正しい開始と終了のコメントタグで予約するだけです：
- あなたのコメントを追加することで始まります
/*
- あなたのコメントを追加して閉じる
*/
これらの2つのタグの間に表示されるものは、コード内でのみ表示され、ブラウザによって表示されないコメントの内容です。
CSSのコメントは、任意の数の行を取り上げることができます。ここに2つの例があります：
/ *赤い枠線の例* / div＃border_red { 国境：薄い赤い赤; }/*******************************************************コードテキストのスタイル*******************************************************/ 多くのデザイナーは、読み込み時にスキャンしやすい小さくて消化しやすい塊でスタイルシートを整理します。一般的に、ページには見やすい大きな、明らかな改行を作成する一連のハイフンの前後にコメントが続きます。次に例を示します。 / * -----------------------ヘッダースタイル----------------------- ------- * /
これらのコメントは、コーディングの新しいセクションの開始を示します。 コメントタグは、それらの間のすべてを無視するようブラウザに指示するので、それらを使用してCSSコードの特定の部分を一時的に無効にすることができます。これは、デバッグ時やウェブページのフォーマット調整時に便利です。実際、デザイナーは、コードの部分を「コメントアウト」または「オフ」にして、その部分がページの一部でない場合に何が起こるかを確認することがよくあります。 これを行うには、コメントアウトする（無効にする）コードの前に開始コメントタグを追加するだけです。無効な部分を終了させる場所に終了タグを配置します。これらのタグの間にはサイトのビジュアル表示に影響するものはなく、CSSをデバッグして問題の発生場所を確認することができます。その問題に対処して修正し、コードからコメントを削除することができます。 要点として、CSSでコメントを使用するためのヒントをいくつか紹介します。 あまりにも多くのコメントを追加すると、サイトのダウンロード速度とパフォーマンスに影響する可能性がありますが、使用することを躊躇しないでください。重大な悪影響を受けるには、数行のコメントが必要です。 Webデザインの多くの側面と同様に、すべてがバランスをとるようになります。 セクションを分割する
「コメントアウト」コード
CSSコメントのヒント
パフォーマンス
