Caution
お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。
- トップページ
- CSS入門編 - CSSのコメントアウト
TechAcademy(テックアカデミー)
当サイト著者の桜舞春人もメンター(先生)としてちょろりと参加しているTechAcademyさんです。爆速で技術を習得して結果を出したいと考える方に超絶おすすめです。
紹介記事はこちらへどうぞ。
運営及び開発費用ご支援のお願い
当サイト(wp-p.info)の情報はお役に立ちましたでしょうか。当サイトでは運営及び開発費用ご支援の募集をさせて頂いております。よろしければご支援についてご検討頂けませんでしょうか。何卒宜しくお願い致します。
CSSのコメントアウト
さらっと飛び込み営業が出来る人を尊敬しています。
というわけでみなさまいかがお過ごしでしょうか。
さて、引き続きCSSでのコメントアウトの記述方法を勉強していきましょう。HTMLでもコメントアウトはありましたね。
※HTMLのコメントアウトについてはこちら
CSSでのコメントアウトもHTMLとほとんど使い方は変わりません。
HTMLでは『<!--』と『-->』をつかってコメントアウトしましたが、CSSでは『/*』と『*/』で挟まれた部分がコメントとなります。
/* ここがコメントだよ */ p { font-size: 18px; font-weight: bold; }
使い方はHTMLとほとんど変わらないので問題はないかと思います。上記のCSSでfont-sizeプロパティのとこをコメントアウトで無効にしたい場合はこのようになりますね。
/* ここがコメントだよ */ p { /* font-size: 18px; */ font-weight: bold; }
んでもって複数行のコメントアウトも記述可能です。
/* コメントは複数行でも記述できるよ。 説明やメッセージとか残すことに使えるよ。 */
style属性に記述した場合もstyle要素を使って記述した場合も同じようにコメントアウトできます。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>CSS 練習中!</title> <style> /* ここがコメントだよ */ p { /* font-size: 18px; */ font-weight: bold; } </style> </head> <body> <p style=" /* color: red; */">ここにスタイルを適用するよ</p> </body> </html>
CSSコメントアウト使用時の注意点としてコメントアウトにコメントアウトを入れ子にすることはできません。
/* これは /* ダメだよ */ */
この場合は最初に登場した『*/』でコメントが終了してしまいます。間違えて記述しないように気をつけましょう。
続いて昔からバグなのか仕様なのかよく分からない変な挙動が1つあります。コメントアウトの『*/』の手前に全角文字があるとなぜか閉じタグとして認識されない、という挙動です。これはブラウザの違いやバージョンによってかなり差があり症状が出たり出なかったりします。最近でも一部のandroid端末でこの症状が出たことがありましたので今後も避けたほうが無難です。
これについては結構忘れがちな部分であるうえに気づきにくいところなのでCSSでコメントアウトする際は最初から文頭と文末に半角スペースを1つ挟むようにすると良いかと思います。『/*』と『*/』ではなく半角スペースを追加して『/* 』と『 */』という形で書くようにするといった感じです。
というわけで以上がCSSのコメントアウトについての解説でした。
次の記事ではID属性とクラス属性について勉強していきましょう。ではー。
この記事は桜舞が執筆致しました。
![]() 著者が愛する小型哺乳類 |
桜舞 春人 Sakurama HarutoISDN時代から様々なコンテンツを制作しているちょっと髪の毛が心配な東京在住のプログラマー。生粋のロングスリーパーで、10時間以上睡眠を取らないと基本的に体調が悪い。好きなだけ寝れる生活を送るのが夢。ゲームとスポーツと音楽が大好き。誰か髪の毛を分けて下さい。 |
記事の間違いや著作権の侵害等ございましたらお手数ですがこちらまでご連絡頂ければ幸いです。
TechAcademy(テックアカデミー)
当サイト著者の桜舞春人もメンター(先生)としてちょろりと参加しているTechAcademyさんです。爆速で技術を習得して結果を出したいと考える方に超絶おすすめです。
紹介記事はこちらへどうぞ。
Introduction
当サイトでは有料会員様の募集をしております。現在約431本の記事を公開中です。
有料会員になるとこれら全ての記事が読み放題となります。
お申込み頂ける際はログインまたはアカウント作成後、有料会員件をご購入下されば幸いです。有料会員権はまとめ買いがお得です。
現在の有料会員権一覧sale中!!
30日分980円
月額約980円、日額約32円
90日分通常2940円のところ1980円 (960円OFF)
月額約660円、日額約22円
180日分通常5880円のところ2980円 (2900円OFF)
月額約496円、日額約16円
360日分通常11760円のところ4980円 (6780円OFF)
月額約415円、日額約13円