• Hajipur, Bihar, 844101

☰
❮
❯

CSS

CSS Basics

CSS Styling Properties

CSS Advanced Selectors & Features

CSS Media and Image Styling

CSS Layout Techniques

CSS Flexbox

CSS Grid

CSS Responsive Design (RWD)

CSS Comments

← Previous Next →

🔹 What Are CSS Comments?

CSS comments are used to explain your code or to temporarily disable part of your CSS.
They do not affect how the CSS runs and are completely ignored by the browser.

🔸 Syntax of CSS Comments
/* This is a comment */

  • Starts with /*

  • Ends with */

  • Can be placed on a separate line or inline with code

🔸 Example 1 – Comment on its own line
/* Set background color */
body {
  background-color: lightgray;
}
🔸 Example 2 – Inline comment
p {
  color: blue; /* Make text blue */
}
🔸 Example 3 – Disable a rule
/*
h1 {
  color: red;
}
*/

✅ The above rule will not apply because it’s inside a comment block.

🔸 Why Use Comments in CSS?

  • To explain sections of your code

  • To organize long stylesheets

  • To debug by temporarily turning styles off

Practice Questions

Q1. Add a comment before setting the text color of all <h1> elements.

Q2. Add a comment above a rule that changes the font size of paragraphs.

Q3. Write a CSS rule for <body> with a comment explaining the background color.

Q4. Add an inline comment to a rule that sets the color of <h2> to red.

Q5. Write a comment to describe the purpose of a .box class.

Q6. Temporarily disable a CSS rule that adds a border to all images.

Q7. Add a comment inside the CSS file explaining that a section is for buttons.

Q8. Comment out the entire CSS block for .card.

Q9. Add a comment stating that a section of CSS applies only to the homepage.

Q10. Add a comment to explain why box-sizing: border-box; is being used.

CSS Comments Quiz

Q1: What is the correct syntax for a CSS comment?

A. // comment
B. <!-- comment -->
C. /* comment */
D. # comment

Q2: Which of these comments will work in CSS?

A. // This is a comment
B. <!-- This is a comment -->
C. /* This is a comment */
D. ** This is a comment **

Q3: What happens to code inside a CSS comment?

A. It gets executed
B. It gets ignored
C. It runs with warning
D. It breaks the CSS

Q4: Which of the following is NOT a valid use of comments?

A. Explaining your code
B. Disabling a CSS rule
C. Optimizing performance
D. Organizing code

Q5: Which symbol ends a CSS comment?

A. */
B. --!>
C. //
D. #

Q6: Where can you place a CSS comment?

A. Only at the top of the CSS file
B. Only after a rule
C. Anywhere in the CSS
D. Only inside HTML

Q7: How would you comment out a CSS rule?

A. // p { color: red; }
B. /* p { color: red; } */
C. -- p { color: red; } --
D. <!-- p { color: red; } -->

Q8: Which comment style is correct for multiple lines in CSS?

A. /**/
B. /* line1 \n line2 */
C. // line1 \n line2
D. <!-- line1 --> <!-- line2 -->

Q9: What is the main benefit of using comments in CSS?

A. Makes file larger
B. Makes code hard to read
C. Helps explain and organize code
D. Increases performance

Q10: What happens if you forget to close a comment with */?

A. Nothing happens
B. Only that comment is ignored
C. CSS after that point may break
D. The browser shows an alert
← Previous Next →
Login
Go Back Top