O'Reilly logo

Sams Teach Yourself CSS in 10 Minutes by Russ Weakley

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 8. Styling a Flexible Heading

In this lesson, you will learn how to create a border above and below a heading, add a continuous gradient background image, and style the text with text-transform and letter spacing.

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).

Example 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.

Example 8.2. HTML Code Containing the Markup for a Heading

<h1 id="header">
    Page Heading
</h1>

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required