Heading Styles

HTML recognizes six heading levels, written as <hl> through <h6>. The number signifies the position of the heading content in a hierarchy, where the smaller numbers mean that the content is higher in the hierarchy, just like in most word processors. Figure 2.6 shows the six heading levels as rendered in IE 5.

Figure 2.6: Six HTML heading levels (ch2-5. htm)

Figure 2.6: Six HTML heading levels (ch2-5. htm)

Again, the formatting of the displayed heading is browser specific. The heading levels will not appear identically in different browsers.

HTML is supposed to be a way of creating structured documents. You organize the document by heading levels like an outline. The top level <h1> might be the document title. Essentially, all other portions of the document would be subordinate to the <h1> level. You would then apply the <h2> style to each major subordinate level, and <h3> to each subheading inside the <h2> level. For example, this chapter, structured in HTML, would look like this: <h1>Chapter 2: HTML Basics</h1>

<h2>HTML Is Just Markup and Content</h2> <h3>What HTML Does</h3> <h3>Why HTML Is Important</h3> <h3>HTML's Limitations</h3> <h2>Syntax: Tags and Attributes</h2> <h3>What Is a Tag?</h3> <h3>What Is an End Tag?</h3> etc...

Note that this is a relatively weak scheme for creating structured documents because there's no way in HTML to specify that the content for the subordinate tags "belongs" to the previous, higher-level heading level. That means that you can't, for example, select an <h2> tag and get all the <h3> tags and text associated with that tag. Instead, the association scheme is by position. The internal HTML parser rule is that all text following a heading level belongs to that heading level until it reaches the next heading level. Also, the browser doesn't format the content following a given heading level any differently from the text for a higher level. The only visual clue to the heading level is the format for the header itself; the renderer doesn't provide a visual clue such as indentation to help you differentiate content in the various levels.

Was this article helpful?

0 0

Post a comment