Set background colors

In the predesigned pages provided with Dreamweaver, the background color of the sidebar is set to gray; for most sites, you may want to change background colors to match your site's color scheme.

To set the background color of the sidebar:

  1. Click in the sidebar heading text.
  2. In the Tag inspector (Window > Tag Inspector), select the Relevant CSS tab.
  3. In the list of rules that apply to the current selection, select the line with the applied rule #col1.

    The status line in the middle of the Tag inspector changes to say "In file: divs.css," indicating that this rule is defined in the divs.css file.

  4. Click the Show Category View button, then expand the Background category.

    The background-color property name is shown with a line drawn through it, indicating that the current selection doesn't inherit the property. However, the background color is visible because the background of the text is transparent by default, allowing the background color of the parent tag to show through.

    Tip: Whenever a property name is crossed out, you can move the pointer to point to the property name; a tooltip appears with more information.

  5. Click in the color box in the right-hand column on the background-color line.

    The color picker appears and the pointer changes to an eyedropper.



  6. Select a color. You can either select a color in the color picker's palette, or click anywhere on your screen to select the color of the pixel you clicked. For example, click the background of the Trio logo image to make the background color of the sidebar match one of the image background colors.

    The sidebar's background color changes to the color you picked.

  7. If you chose a dark color, then (with the #col1 rule still selected in the upper part of the Tag inspector) expand the Font category in the lower part of the Tag inspector and set a contrasting color (such as white) for the text, using the color attribute.
  8. Save your page.
  9. Switch to the divs.css document (using the Window menu) and save that document as well.

    Dreamweaver automatically opened the divs.css style sheet when you changed the background color, which is defined in that style sheet.


 

Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/dreamweaver/mx2004/getting_started_en/gs_04_10.htm