How to Create Swaps with Multiple Images in Dreamweaver
How to Define Styles with the Tag Selector in Dreamweaver
How to Use the Open Browser Window Behavior in Dreamweaver

How to Edit a Style in Dreamweaver

You can change the attributes of any style in Dreamweaver after you create it by editing its style definition. This is where some of the biggest advantages of Cascading Style Sheets come into play. You can make global changes to a page (or even to an entire website) by changing a style; when you edit the style, the changes are applied automatically to every element that uses the style.

One of the reasons why external style sheets are so valuable is that you can create styles that are used on any or all pages in a site. Beware, however, that this capability can also lead to problems. If you decide to edit a style when you use it on a new page, don’t forget that you’ll be changing the formatting everywhere else you’ve already used that style.

You can create new styles by duplicating an existing style, giving it a new name, and then altering the style definitions. This time-saving trick is useful when you want to create a new style that’s similar to an existing one.

To edit any existing style (whether it was created using the class, tag, or ID selector), follow these steps:

  1. Open the CSS Designer panel by choosing Window→CSS Styles.

  2. In the CSS Designer Selectors panel, select the name of an existing style.

    The style rules are displayed in the Properties panel.

    If you want to edit a style that has already been used to format text, images, or other content in the page open in Dreamweaver, select the content. The name of the style applied to that content will be displayed in the Selectors panel, making it easy to find and edit.

  3. Edit the settings for the style to your liking.

    • If you edit a style in the CSS Rule Definition dialog box, changes are applied automatically when you click the Apply button or when you click OK.

    • If you edit a style definition in the Properties panel, the changes are applied automatically as soon as you press the Return or Enter key or click outside the formatting field in the panel.

  • Add a Comment
  • Print
  • Share
blog comments powered by Disqus
How to Create Styles with Class and ID Selectors in Dreamweaver
How to Switch between CSS and HTML Mode in the Dreamweaver Property Inspector
How to Insert a Background Image in Dreamweaver
How to Add Images to Your Website in Dreamweaver
How to Set Up Dreamweaver’s FTP Features
Advertisement

Inside Dummies.com