Previous Contents Next
5. Headings and Rules

The following sections describe HTML tags that are used to include headings in your document and to break sections with horizontal rules.

The <Hn> (Heading) Tag

The heading tag is a container tag describing six levels of headings: H1, H2, H3, H4, H5, and H6. Each of these levels will have its own appearance in the browser, with the author having no direct control over what that exact appearance will be. This is part of the HTML philosophy: the document writer has responsibility for the structure and content, while the browser has responsibility for the appearance.

The heading specifications:


<H1>This is a first-level heading</H1>
<H2>This is a second-level heading</H2>
<H3>This is a third-level heading</H3>
<H4>This is a fourth-level heading</H4>
<H5>This is a fifth-level heading</H5>
<H6>This a a sixth-level heading</H6>


are rendered in the browser window approximately as shown below:

This is a first-level heading

This is a second-level heading

This is a third-level heading

This is a fourth-level heading

This is a fifth-level heading
This a a sixth-level heading

It is not necessary to use the heading levels in their numeric sequence. Note also that each heading line is automatically preceded and followed by a paragraph break, leaving a blank line before and after the heading.

The ALIGN attribute may also be used in the heading tag. Its general format is

<Hn ALIGN=LEFT|CENTER|RIGHT> heading </Hn>

which aligns the heading to the left or right, or at the center, of the browser window.

The <HR> (Horizontal Rule) Tag

Horizontal lines can be used to provide visual breaks between sections of a page. The horizontal rule tag <HR> draws a shaded horizontal line across the browser's display. It is not a container and does not require an end tag. A simple rule using this tag on a line by itself is shown below:


There are several attributes that accompany the horizontal rule:

<HR WIDTH=n SIZE=n NOSHADE ALIGN=LEFT|CENTER|RIGHT>

The WIDTH parameter specifies the length of the rule, expressed in number of pixels (WIDTH=300) or a percentage of the window width (WIDTH=80%). The following rule is specified with the tag <HR WIDTH=50%>:


The SIZE parameter gives the height of the rule in pixels (the default size is 1 pixel). For example, the specification <HR WIDTH=50% SIZE=10> produces the following rule:


The NOSHADE parameter removes the 3D shading effect, as in the specification <HR WIDTH=50% SIZE=10 NOSHADE>:


The ALIGN parameter, as in previous uses, aligns the rule to the left, center, or right of the browser window. The default alignment is centered. For example, the specification <HR WIDTH=50% SIZE=10 NOSHADE ALIGN=RIGHT> produces the rule:


In Internet Explorer a COLOR parameter, along with the NOSHADE parameter, can be used to assign a color to the rule. The color is ignored in Netscape Navigator. Specifying colors is covered in the next topic.

Of course, there are a number of other ways besides headings and horizontal rules that can be used to set off sections of a page. You can use graphic images, for instance. We'll get into that discussion when covering graphics. For now, fasten your seat belt and let's race ahead to the next topic.


Previous Contents Next