CSS Comments

CSS Comments

CSS comments are ignored by the browser when rendering the page. css comments are commonly used by programmers. They help explain code, leave reminders, or temporarily disable parts of a stylesheet without deleting them.

CSS Comment Syntax

A CSS comment is placed inside the HTML <style> element, and starts with /* and ends with */:

Syntax

Run Code
/* Comment in here */

Example

Run Code
/* This is a single-line comment */
p {
  color: red;
}

You can add comments wherever you want in the code:

Example

Run Code
p {
  color: red;  /* Set text color to red */
  font-size: /* 20px */ 16px;
}

Comments can also span multiple lines:

Example

Run Code
/* This is
a multi-line
comment */

p {
  color: red;
}

HTML and CSS Comments

From the HTML tutorial, you learned that you can add comments to your HTML source by using the <!--...--> syntax.

In the following example, we use a combination of HTML and CSS comments:

Example

Run Code
<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red; /* Set text color to red */
}
</style>
</head>
<body>

<h2>My Heading</h2>

<!-- These paragraphs will be red -->
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>HTML and CSS comments are not shown in the output.</p>

</body>
</html>