HTML (English) 05
ADDING A HORIZONTAL RULE
Now that the paragraphs stick together, the headings don’t look as if they form units with the text. One easy fix for that is to use a horizontal rule to put each section into its own little unit. Separating sections of your document with a horizontal line, or rule, is easy. Just use the <HR> tag. Note that the <HR> tag, like the lone <P> tag, has no>/HR> tag. Not only is a horizontal rule produced, but the line is broken at that point as well. Jumbo’s new and improved HTML file shown in listing 1-5.
Listing 1-5 Rules.html
<HTML> <HEAD> <TITLE>Jumbo’s Jungle Java Joint – Home Page</TITLE>
</HEAD.
<BODY>
<H1>Jumbo’s Jungle Java Joint <H1><HR>
<H2>Welcome to Jumbo’s </H2>
<HR>
<H3>Our Primo Daily Specials <H3>
<HR>
<H4>Business Class Specials <H4>
<HR>
<H5>All-You-Can-Drink Specials </H5>
After a single cup, you’ll agree,
You’ve had all you can drink.
<HR>
<H6>Jumbo’s Complaint Department </H6>
If you wish to complain, go elsewhere! <BR>
Jumbo’s is a negative-free zone!
<BODY>
<HTML>
BOLD, ITALIC, AND UNDERLINED TEXT
An easy way to add emphasis to a page is to use special fonts. One way to do that is to make some words bold, italic, or underlined. Unlike the other tags you have seen, these tags do deal with the appearance of the text. For that reason, some purist HTML authors eschew these tags in favor of the strong and emphasized tags, which hark back to structure-not appearance.
You make a word, paragraph, or section bold by placing it between the <B> </B> pair. Use of the strong tags, <STRONG> and </STRONG>, usually has the same effect. Italic, or slanted, text is created by use of the <I> </I> tag pair. You can usually substitute the emphasized tags, <EM> and <E/EM> for italic. Finally, underlined text can sometimes be obtained by use of the <U> and </U> tags. Listing 1-6 shows Jumbo’s improved HTML file, and Figure 1-24 shows the result of adding these tags to the page. Some browsers, such as older versions of Navigator, do not support underlined text. Don’t surprise if you don’t see the underlines.
Listing 1-6 Styles.html
<HTML> <HEAD> <TITLE> Jumbo’s Jungle Java Joint – Home Page</TITLE>
<HEAD.
<BODY>
<H1>Jumbo’s Jungle Java Joint </H1><HR>
<H2>Welcome to Jumbo’s </H2>
<HR>
<H3>Our Primo Daily Specials </H3>
The special today is the <B>bold</B> Brazilian Roast<BR>
Or, you may prefer our <I>Italian</I> Espresso!<BR>
At Least you’ll never wait <U>on Line</U>
<HR>
<H4>Business Class Specials </H4>
At Jumbo’s we <EM>emphasize</EM> making our customers
Happy, even if it takes a <STRONG>strong</STRONG> cup o’ joe!
<HR>
<H5>All-You-Can-Drink Specials </H5>
After a single cup, you’ll agree,
You’ve wish to complain, go elsewhere! <BR>
Jumbo’s is a negative-free zone!
<BODY> </HTML>
COMMENTS
In addition to what shows up on screen, it’s often helpful to include comments, that is, blocks of text that do not show up on the browser, in your HTML documents. Comments are a useful way of placing reminders in your documents, keeping a record of who created a particular document and when, record of who created a particular document and when, recording changes to a document, or explaining why a particular document was written the way it was. Comments are identified by enclosing them in the <!-- and --> tags. These tags are unlike other tags you’ve seen, because the first tag lacks the ending angle bracket and the last tag lacks the beginning angle bracket. In a way, the entire comment can be considered a single tag. Listing 1-7 shows the revised page that includes some comments. Note that comments can span several lines.
Listing 1-7 Comments.html
<HTML>
<!--**********************************
This is a sample page: don’t use
It for your own home page
Created on January 31, 1885 by
Hezekiah Tinius McLanguage
-->
<HEAD>
<TITLE>Jumbo’s Jungle Java Joint – Home Page</TITLE>
</HEAD.
<BODY>
<H1>Jumbo’s Jungle Java Joint </H1><HR>
<H2>Welcome to Jumbo’s </H2>
<HR>
<H3>Our Primo Daily Specials <H/3>
The special today is the <B>bold</> Brazilian Roast<BR>
Or, You may prefer our <I>Italian</I> Espresso!<BR>
<!--The following line may NOT print in underling -->
At Least you’ll never wait <U>on Line</U>
<HR>
<H4>Business Class Specials </H4>
<!--These are the preferred tags over <B> <I> and <U> -->
At Jumbo’s we <EM>emphasize</EM> making our customers
Happy, even if it takes a <STRONG>strong</STRONG> cup o’ joe!
<HR>
<H5>All-You-Can-Drink Specials </H5>
After a single cup, you’ll agree,
You’ve had all you can drink.
<HR>
<H6>Jumbo’s Complaint Department </H6>
If you wish to complain, go elsewhere!<BR>
Jumbo’s is a negative-free zone!
</BODY>
</HTML>
