Table Cell Color in Adobe CS5 Dreamweaver - dummies

By Jennifer Smith, Christopher Smith, Fred Gerantabee

You can change colors of a single cell, multiple cells, or an entire row in Adobe Creative Suite 5 (Adobe CS5) Dreamweaver. You can use either standard HTML attributes or use CSS rules to apply color to any portion of a table, but the easiest way is to use the Property inspector to assign a background color.

  1. Ctrl-click (Windows) or Command-click (Mac) anywhere within a cell to select that cell.

    You can continue to add cells to your selection by keeping the key pressed and clicking more cells.

  2. In the Property inspector, make sure that HTML view is selected (click the HTML tab on the left edge of the panel) and locate the Bg Color Picker.

  3. Assign color to cells by following one of these methods:

    • Click the swatch to the right of Bg and select a color from the Color Picker that appears. Remember that you can choose from additional color models by clicking the palette menu in the upper right corner of the Color Picker.

    • If you know the hexadecimal number of your color, you can type it in the text field next to the Bg color swatch.

    • Select a color from any element you can see onscreen by clicking the color fill box to the right of Bg and then moving the Eyedropper tool over any color on your screen that you want the cell color to pick up. Click when the color appears in the Color Picker preview window.

  4. The color is applied as a background to the selected cells.

In addition to using the Property inspector, you can include background color settings in a new CSS rule and apply them to an entire table, cell, or row with the Property inspector.

  1. Create a CSS Class rule from either the Property inspector or the CSS Styles pane.

  2. Under the Background category in the CSS Rule Definition dialog box, assign a color to the Background color property and then click OK.

  3. Select the table or cell you want to apply the new Class style to.

  4. Assign the class by using the Class drop-down list in the Property inspector.