Adding Comments Within CSS


You want to organize and keep track of the CSS with comments.

Add /* and */ anywhere in the styles to show the start and end of a comment.

/* This is a comment */
a {
 text-decoration: none;
}
/* This is also a comment */
h1, h2 {
 font-size: 100%;
 color: #666666;
}

Discussion

You may look at old code and not remember why you took certain steps with that code. Comments can explain and organize code to help with reviewing at a later time. Comments also help those who don't create the original code understand its purpose. Browsers ignore content that appears between the /* and */.

As you break up your code by section, comments come in handy in identifying each section such as header, footer, primary navigation, subnavigation, and so on. Comments provide a great way to test your web pages. If you're not sure about a style rule or how it affects the page, add a comment around the style to turn it off.

/* 
a {
 text-decoration: none;
}
*/

The style rule for text-decoration won't take affect with the comments taking it out of circulation. Unless there are other styles for a, the underline appears under links until the comment is removed.