Dreamweaver Article

Working with Background Images and CSS – Part 2: Placing Images with Precision

Note: This article has been updated for Dreamweaver 8. If you are still using Dreamweaver MX 2004, please read the version of this article series for Dreamweaver MX 2004.

In Part 1 of this series, I began by reviewing the keywords you can use with the background-position property. If you are unfamiliar with using background images and cascading style sheets (CSS), I suggest you read this tutorial from the beginning. In this part, you learn how to place your background images with greater accuracy. You will also see how you can use multiple keywords in the value of the background-position property, and how the flexibility of the CSS syntax allows you to write the selectors in different ways. Throughout this part, you continue to work with the bgimage.gif you created in part one.

I've included a sample page in the tutorial files for each of the options I cover in this tutorial. You can download the pages and read through the code as you go or, if you prefer, simply work along with the tutorial and build your own pages as you read along.

Requirements

To complete this tutorial you will need to install the following software and files:

Dreamweaver 8

• Try
• Buy

Fireworks 8

• Try
• Buy

Sample files:

• css_image_samples2_dw8.zip (ZIP, 3K)

Prerequisite Knowledge

Part 1 of this series and a basic knowledge of working with Dreamweaver and Fireworks

Page 1 of 6

Next Page

About the author