Altering the Styles

Now that we’ve built up one style sheet, let’s create a new and different one. Instead of starting from scratch, though, let’s rewrite the one we have so that we can recycle the bits we want to keep and change the bits we don’t. We aren’t going to mess with the HTML any more. We’re just going to change the CSS, and this time we’re going to start at the top of the page and work our way down.

The Page Itself

Before we start changing the text, let’s change the page itself. A nice touch would be to “watermark” the company logo into the background of the page. To do this, all we need is a graphic file containing the logo—let’s assume it’s WidgetCoLogo.gif—and an alteration to our basic body styles:

body {background: white url(WidgetCoLogo.gif) ...

Get Eric Meyer on CSS: Mastering the Language of Web Design now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.