Setting CSS Properties

This tutorial illustrates setting CSS properties in Dreamweaver CS5.

You will often need to change the properties of a CSS rule. There are various ways of doing this, but let's start with the document we used in the last section and the CSS Styles Panel.

Let's make some changes to the .header rule.

One way to do this is to select it and then make changes in the lower panel in the CSS Styles Panel. At the bottom of the panel is a Show List View button, which lists all of the available properties.

If I press this button I see all of the properties, and can select or specify values for any of them that I want to.

Here I'm specifying that text-align should be Center.

Having done that, I press the command button Show only set properties and the lower panel now only shows the set properties.

An alternative to this approach is to use the Add Property link shown and add the required properties one at a time.

Another way to change the properties for a style is to double click the style name in the CSS Styles Panel. This invokes the CSS Rule Definition with its various pages.

The Type page lets you specify everything about your choice of font, including combination, size and color.

The background page lets you specify background color, place an image in the background, etc. Let's change the background color from green to red.

The other pages of the dialog enable you to specify spacing and alignment, border settings, etc.

So, I've saved my changes and all I need to do now is to see these revised CSS properties in action by applying the .header style to some text.

On applying the style to the first paragraph, the background is set to red and the text is center aligned.

More Dreamweaver Tutorials

All Dreamweaver CS5 Tutorials - Will be complete by Januay 2011.
Buy Dreamweaver CS5

Find this website useful?

To link to this page from your website, simply cut and paste the following code to your web page.

It will appear on your page as: Setting CSS Properties in Dreamweaver CS5

Share this Webpage

This site proudly build with Site Build It!