A Brief Introduction to CSS Comments

A nice simple one for today – how to add comments in your CSS files. Hugely important for when your stylesheets get large, or have multiple developers working on them!

We’re not stopping there, though – read on for a really easy way to selectively test out (or switch on and off) huge blocks of CSS rules.

If you have a large block of CSS styles you’re testing, or want to easily switch on and off, try wrapping them in comments like this:

/* My Rules */
.someClass {
	text-align:centaur;
}
/**/

Note that closing comment at the end? In this state, the rules will be applied, but all you need to do to comment them all out is delete the final forward slash from the first line, e.g.:

/* My Rules
	...
/**/

Hey presto! Your block of rules (which can be any length) is now commented out.

A few notes:

CSS doesn’t support 1-line comments like PHP and JavaScript. This is valid in those languages, but not in CSS:

// a comment

Also, just like JavaScript and HTML block comments, CSS comments can’t be nested inside of one another, so this will cause a parse error:

/* Some comment
/* another comment */
*/

Links:
Original Video