HOME > Headings

WEB DESIGN: BASICS

HEADINGS

Let's say you want a heading on your page you could use the <FONT></FONT> tag to do this.

<P><FONT SIZE="5">THE EIFFEL TOWER</FONT></P>

<P>The Eiffel Tower is located on the Left Bank (that is, the southern bank) of the Seine river, at the northwestern extreme of the Parc du Champ de Mars, a park in front of the École Militaire that used to be a military parade ground (whence the name), in the southwestern portion of the city. ...

While this works, there is an easier way using the <H#></H#> tag. They range from 1 (largest) to 6 (smallest) and all are automatically bolded.

<H1></H1>

<H2></H2>

<H3></H3>

<H4></H4>

<H5></H5>

<H6></H6>

EXAMPLE 1

<HTML>

<HEAD>

<TITLE>The Eiffel Tower</TITLE>

</HEAD>

<BODY>

<H1>The Eiffel Tower</H1>

<P><FONT COLOR="blue" SIZE="4">The Eiffel Tower</FONT> is located on the Left Bank (that is, the southern bank) of the Seine river, at the northwestern extreme of the Parc du Champ de Mars, a park in front of the École Militaire that used to be a military parade ground (whence the name), in the southwestern portion of the city. The four pillars supporting the tower are aligned to the points of the compass, and the base covers almost exactly the area of two (American) football fields placed side by side lengthwise.</P>

<P>The nearest Métro stations are <FONT SIZE="4">Bir-Hakeim</FONT> to the southwest, and <FONT SIZE="4">Trocadéro</FONT> to the northwest. The former is at the same level as the tower and somewhat closer, but less scenic; the latter is on the side of the Parvis (Plaza) du Trocadéro opposite the tower, so if you get off at that station, you can take a very scenic walk through the Trocadéro and down across the Seine to the tower, with many good photograph opportunities. One of my pictures of the tower was taken from this location.</P>

<P>The area of the tower is in the <FONT FACE="courier" COLOR="purple" >chic</FONT> seventh <FONT FACE="courier" COLOR="green">arrondissement</FONT> of Paris, also the home of the National Assembly, the Prime Minister’s palace, and the Hôtel des Invalides. This district is roughly at the eight-o’clock position on a map of Paris, and somewhat more centered than the adjacent Fifteenth.</P>

</BODY>

</HTML>

Just like paragraphs, you can also align headings. By default, headings are left justified. The align options are: right, left, center.

EXAMPLE 2

<HTML>

<HEAD>

<TITLE>The Eiffel Tower</TITLE>

</HEAD>

<BODY>

<H1 ALIGN="center">The Eiffel Tower</H1>

<P>The area of the tower is in the <FONT FACE="courier" COLOR="purple">chic</FONT> seventh <FONT FACE="courier" COLOR="green">arrondissement</FONT> of Paris, also the home of the National Assembly, the Prime Minister’s palace, and the Hôtel des Invalides. This district is roughly at the eight-o’clock position on a map of Paris, and somewhat more centered than the adjacent Fifteenth.</P>

</BODY>

</HTML>

If you ever want to justify (left,center,right) more than one section of a page or the entire page, you can use the <div> tag. The align options are left, center, and right.

EXAMPLE 3

<HTML>

<HEAD>

<TITLE>The Eiffel Tower</TITLE>

</HEAD>

<BODY>

<H1>The Eiffel Tower</H1>

</div>

<div align="left"> <i>(Center)</i>

</div>

<div align="right"> <i>(Right)</i>

<P>The area of the tower is in the <FONT FACE="courier" COLOR="purple">chic</FONT> seventh <FONT FACE="courier" COLOR="green" >arrondissement</FONT> of Paris, also the home of the National Assembly, the Prime Minister’s palace, and the Hôtel des Invalides. This district is roughly at the eight-o’clock position on a map of Paris, and somewhat more centered than the adjacent Fifteenth.</P>

</div>

</BODY>

</HTML>

WEB DESIGN: Basics • Last Modified: 5/1/02