Tutorial: Text Formatting in Action

In this tutorial, you'll gussy up headlines, lists, and paragraphs of text using CSS's powerful formatting options.

To get started, you need to download the tutorial files located on this book's companion Web site at http://www.sawmac.com/css/. Click the tutorial link and download the files. All of the files are enclosed in a ZIP archive, so you'll need to unzip them first. (Go to the Web site for detailed instructions on unzipping the files.) The files for this tutorial are contained inside the folder named chapter_06.

Setting Up the Page

  1. Launch your Web browser and open the file chapter_6 → text.html (see Figure 6-10).

    As usual, you'll be working on a Web page from CosmoFarmer.com. In this case, there's already an external style sheet attached to the page, adding some design and layout touches. It's a glimpse of some of the things you'll be learning in future chapters. For now, concentrate on improving the look of the text on this page.

    The page begins with some basic layout and formatting. You'll make the text sparkle!

    Figure 6-10. The page begins with some basic layout and formatting. You'll make the text sparkle!

  2. Open the file text.html in your favorite text editor.

    Start by adding an internal style sheet to this file. (Yes, external style sheets are better, but it's perfectly OK to start your design with an internal sheet. See the box in Section 3.1.)

  3. In the <head> of the Web page, click directly after the <link> tag (used ...

Get CSS: The Missing Manual 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.