Accessibility

Table of Contents

Creating your first website – Part 4: Formatting your page with CSS

Locate your files and review your task

In this tutorial, you'll begin with the Cafe Townsend index page to which you added content in Part 3: Adding content to pages. If you did not complete that tutorial, you can either complete it before proceeding, or you can work with the finished version of the tutorial. The finished version of the tutorial, add_content.html, is located in the completed_files folder, within the cafe_townsend folder that you copied to your hard drive in Part 1: Setting up your site and project files.

Note: If you begin this tutorial with the completed add_content.html file, instead of the index.html file from Adding Content to Pages certain steps and illustrations in the tutorial will not match what you see on your screen.

For this task, you'll use cascading style sheets (CSS) to format the text on the home page for Cafe Townsend, a fictional restaurant. You'll create different kinds of CSS rules to format the body text. You'll also format the link text on the left side of the page to create a navigation bar. When you're finished, your page will look like the one in Figure 1.

What your page will look like when you're finished

Figure 1. Your finished page

For more information about CSS, go to the following section. To start creating CSS right away, proceed to the Create a new style sheet section.