Figure 2.10. The comment remains hidden in the on-screen display
Comments must start with <!--, after which you're free to type whatever you like as a "note to self." Well, you're free to type almost anything: you cannot type double dashes. Why not? Because that's a signal that the comment is about to end -- the --> part.
Oh, and did you spot how we snuck another new element in there? The emphasis element, denoted with the <em> and </em> tags, is used wherever ... well, do I really need to tell you? Actually, that last question was kind of rhetorical. It was there to make a point: did you notice that the word "really" appeared in italics? Read that part to yourself now, and listen to the way it "sounds" in your head. Now you know when to use the em element!
Using Comments to Hide Markup from Browsers Temporarily
There is no limit to the amount of information you can put into a comment, and this is why comments are often used to hide a section of a web page temporarily. Commenting may be preferable to deleting content, particularly if you want to put that information back into the web page at a later date (if it's in a comment, you won't have to re-type it). This is often called 'commenting out' markup. Here's an example:
Example 2.4. commentout.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Commenting out XHTML</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
</head>
<body>
<h1>Current Stock</h1>
<p>The following items are available for order:</p>
<ul>
<li>Dark Smoke Window Tinting</li>
<li>Bronze Window Tinting</li>
<!-- <li>Spray mount</li>
<li>Craft knife (pack of 5)</li> -->
</ul>
</body>
</html>
Figure 2.11 shows how the page displays in Firefox.
Figure 2.11. The final, commented list items are not displayed
Remember, you write a comment like this: <!--Your comment here followed by the comment closer, two dashes and a right-angled bracket-->.
Symbols
Occasionally, you may need to include the greater-than (>) or less-than (<) symbols in the text of your web pages. The problem is that these symbols are also used to denote tags in XHTML. So, what can we do? Thankfully, we can use special little codes called entities in our text instead of these symbols. The entity for the greater-than symbol is >; we can substitute it for the greater-than symbol in our text, as shown in the following simple example. The result of this markup is shown in Figure 2.12.
Example 2.5. entity.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Stock Note</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
</head>
<body>
<p>Our current stock of craft knives > our stock of spray mounts, but we still need to get both of them in as soon as possible!</p>
</body>
</html>
Figure 2.12. The > entity is displayed as > in the browser
Many different entities are available for a wide range of symbols, most of which don't appear on your keyboard. They all start with an ampersand (&) and end with a semicolon. Some of the most common are shown in Table 2.1.
Table 2.1. Some common entities
| Entity | Symbol |
> | > |
< | < |
& | & |
£ | £ |
© | © |
™ | ™ |
Share and Enjoy:
