Working with Graphics and Tables - New Perspectives on Adobe Dreamweaver CS5, Comprehensive - page 242

Figure 5-6 NextBest Fest logo in the home page

inserted logo

click to insert an
image in the page

resize handles visible
on selected logo

nb_logo.gif image in
the graphics folder

image properties
appear in t he
Property i n spector

Trouble? If you don't see the nb_logo.gif file in the graphics folder, you need to
refresh the files list. On the Files panel toolbar, click the Refresh button.

◗

10. Click a blank area of the Document window to deselect the logo, and then save
the page.

Formatting Graphics Using CSS Styles and the
Property Inspector
You can change some attributes of inserted graphics by formatting them. You format
graphics either by creating a CSS style and applying it to the graphic or by selecting the
graphic and setting its attributes in the Property inspector. In general, you should use CSS
to format images rather than HTML attributes that are inserted directly into the image
tag. This keeps all the styles in one place and allows you to make global changes to all
instances of the style. This is especially important if you plan to add the same attributes
to multiple graphics in the Web site.
The process for creating and applying CSS styles to graphics is the same as the process
for creating and applying CSS styles to text. All of the same attribute categories are avail-
able. CSS styles are commonly used to add borders to graphics; defi ne the border style,
width, and color; add margins or padding to graphics; and align or position graphics.
You can also insert an image in a div tag and apply CSS styles to the div. Finally, you can
redefi ne the image tag, <img>, if you have style elements that you want to apply to all of
the images in a site.

If you define an attribute
in the style that is not
applicable to a graphic ele-
ment, such as a font group,
the display of the graphic
element is not affected.