Dreamweaver CS5: The Missing Manual

Tutorial: Inserting and Formatting Graphics

In this tutorial, you’ll learn how to insert a photo, add a rollover image, and apply CSS to improve the look of a web page. You’ll also learn how to use background images to enhance the look of headlines.

Note

You’ll need to download the tutorial files from http://www.sawmac.com/dwCS5/ to complete this tutorial. See the note on Note for more details.

Setting Up

Once you download the tutorial files and open Dreamweaver, set up a new site as described on Setting Up a Site. You should be pretty good at this routine by now, but here’s a quick recap, as well as the introduction of another setting that’s helpful when you work with images.

1. Choose Site→New Site.

   The Site Setup window appears.

2. Click the Advanced button, and, for the Site Name, type Images. To the right of the “Local Site Folder” box, click the folder icon.

   The Choose Local Root Folder window appears. This is just a window into your computer’s file system; navigate to the proper folder just as you do when you work with other programs.

3. Navigate to MM_DWCS5 folder, and then select Chapter06. Click the Select (Windows) or Choose (Mac) button to identify this folder as the local root folder.

   The just completed steps are the only ones required to define the site; however, you’ll find one other setting useful when working with images.

4. Click the Advanced Settings option in the left-hand side of the window to reveal seven additional categories.

   Most of the options here are related to Dreamweaver’s ...