Приглашаем посетить
Чернышевский (chernyshevskiy.lit-info.ru)

Styling the Heading

Previous Page
Table of Contents
Next Page

Styling the Heading

To style this heading, you will need a selector that targets the <h1> element. To make sure you don't target every <h1> on the page, you should also include a unique identifier, such as header, within the selector (see Listing 8.1).

Listing 8.1. CSS Code Showing the Selector to Style the Heading
h1#header {...}

The HTML code used for this heading is shown in Listing 8.2.

Listing 8.2. HTML Code Containing the Markup for a Heading
<h1 id="header">
    Page Heading
</h1>

Heading Levels and Document Structure

Styling the Heading

Web documents should use semantically correct markup to add meaning to the content. For example, headings should be placed inside heading elements, paragraphs of text should be placed inside paragraph elements, and lists should be placed inside list elements.


When the semantically correct HTML markup is in place, CSS can be used to visually style the content.

Heading levels are an important part of this markup. Ideally, web pages should start with a single <h1> element for the most significant information on the page, such as the page title or the site name.

Headings should never be faked using <font> or <strong> elements because they do not provide meaning for devices such as screen readers or text-based browsers.



Previous Page
Table of Contents
Next Page