CSS comments


Just like in HTML, CSS also has comments.

Remember, comments allow you to add notes to your code that are just for you or other developers to read. The browser will ignore whatever text is inside the comments, so you don’t have to worry about the comment breaking your code. You can also use comments to temporarily disable one or more lines of code, just like in HTML.


Create comment

To get started, create a blank line at the top of the file.

To create a comment in CSS, you can use the same shortcut we learned in HTML: Control + / on Windows or Command + / on macOS. This will create the opening and closing parts of the comment and put your cursor in the middle.


You’ll notice that a CSS comment looks very different from an HTML comment. It always starts with a forward slash and asterisk, and ends with the reverse: an asterisk and then a forward slash.

You could also type out these symbols manually to create a comment, but I prefer using the keyboard shortcut.

Add text

In between the opening and closing parts, you can write whatever notes you need to keep track of your code. For now just write, This is a comment.

Your comment can also span multiple lines, so you can press Enter to make it take up more room.

Disable code

Just like in HTML, you can put your cursor on a line of code and use the same Control + / or Command + / shortcut to disable it.

Try that on the line with the declaration.

Notice the paragraph text turns black again.

Uncomment code

Just like in HTML, you can use the same the same Control + / or Command + / shortcut to uncomment the line. Try that on the line with the declaration.

Now the paragraph text is red again.

This is handy if you want to quickly test how a web page looks with or without some CSS code.


And that’s how you can use comments in CSS.

Complete and Continue