HTML & CSS: Comments

Before we really get deep into learning HTML and CSS, it's important that we learn a few fundamental code presentation concepts and tips. We've already covered indentation and other forms of basic formatting, but in this tutorial we are going to talk about commenting code.

Comments are notes in your code, ignored by the browser (well - of course IE (the browser typically hated by web developers and designers) makes an exception to this rule). They are usually used to explain code and to provide notes to yourself (useful if you're putting down a project for a little while) or to other people (if your working in a team, or are putting your code on GitHub).

Commenting In HTML

Comments in HTML are easily created by starting the comment using an opening angle bracket, followed by an exclamation mark and two hyphens:

<!--

The text in the comment is then written, for example This is a comment (possible one of the worst comment messages of all time), and then the comment is closed using two hyphens followed by a closing angle bracket:

-->

So if we wanted to comment the title tag of an HTML document, we might want something like this:

<title>Page Title</title> <!-- Set the page title to “Page Title” -->

Commenting in CSS

Comments in CSS also have very simple methods of starting an ending comments. Using /* and */ like so:

/* Comment here */

If we wanted to comment our setting of the body text colour we might do something like this:

body{
	color: red; /* This sets the body text colour to “red” */
}

Back to HTML & CSS