CSSコードのコメントアウトのやり方について

今回は、「CSSコードのコメントアウトのやり方」について解説していきます。

コメントアウトは実際の業務でも頻繁に使います。

コーディング初心者で分からない人は是非理解しておきましょう!

コメントアウトとは?

そもそも、コメントアウトとはなんでしょうか?

コメントアウトとは、ソースコード上にコードの処理のメモや注意書きを残しておくことです。

コメントアウトがあることで、他の人が書いたソースコードを理解することが出来たり、チームメンバーにソースコードについて注意書きや共有ができます。

ちなみに、コメントアウトしたコードはブラウザで表示されることはありません。

CSSコードのコメントアウトのやり方について

それでは「CSSコードのコメントアウトのやり方」を見ていきましょう!

色々なパターンがあるので、是非コピペして試してみてください。

1行のコメントアウト

コメントアウトをする時は、「/* ここにコメントを書く */」のように記号で囲います。

上記のように、コードの内容をコメントで残しておくことができます。

複数行のコメントアウト

複数行のコメントアウトをすることもできます。

上記のように、文章を改行してコメントアウトすることもできます。

セクションごとのコメントアウト

WEBサイトはいくつかのセクションの集まりで構成されています。

セクションごとにコメントアウトをすることによって、どのセクションのCSSか一目で理解しやすくなります。

CSSのコードを丸ごとコメントアウト

CSSのコードを丸ごとコメントアウトにすることもできます。

念の為に前のCSSを残しつつ、新しいCSSコードを試す際に使えます。

コメントアウトのショートカットキー

VSCodeなどのエディタでは、WindowsとMacにそれぞれコメントアウトするためのショートカットキーが存在します。

・Windows: 「Ctrl」 + 「/」

・Mac: 「command」 + 「/」

 

ショートカットキーの方が簡単にコメントアウトをすることができるので、おすすめです。

まとめ

以上が、「CSSコードのコメントアウトのやり方」でした。

是非試してみてください。

この記事を書いた人
Yujiro WEBコーダー

大阪のWEB制作会社で働くコーダー。コーディングにハマり、気づいたらWEB制作を仕事にしていました。現在は新規のWEBサイト制作やWordPressカスタマイズしたり、当技術ブログを運営しています。

関連記事