Define the Site and Create External Style Sheet

Define the Site:

Give the site a descriptive name (example: Creating CSS Style sheet). Make sure you create your root folder along with your picture folder.

Creating the Main Page:

Open Dreamweaver. Create a new HTML document:

New HTML Document

Give it a descriptive name. I saved my page as "mycssstyle." Dreamweaver will assign the format for the page, either .html or .htm.

Make sure you assign a Title to your document Page Title.

Start a Style Sheet and Link it to Your Page:

At the CSS Styles panel click the new style button (+) at the bottom of the palette.

Add New Style

The New CSS Style dialog will open. For the selector type select Tag, selector name body, and rule definition New Style Sheet File.

New CSS Style

Click OK. This takes you to the Save Style Sheet File As dialog box. In your root folder save the css file with a unique name, I named mine project.

Save Style Sheet

Click Save to save your css file to your root folder.

The CSS Style Definition window will open with the Type Category active. Select a Font-family and font-size for your style sheet.

Body Style

Select the background category and select a color for your background.

Body Background Color

Select the Box category and select the following values for your style sheet.

Body Box

Click OK to set the body style to your external style sheet called "Project." Your CSS panel should now look like the graphic below. Notice the style sheet name and values you entered:

CSS Style Sheet

Creating a CSS Style Sheet