Advertisement
Online Test Banks
Score higher
See Online Test Banks
eLearning
Learning anything is easy
Browse Online Courses
Mobile Apps
Learning on the go
Explore Mobile Apps
Dummies Store
Shop for books and more
Start Shopping

How to Apply Table Formatting with CSS in Adobe Dreamweaver CS6

In addition to using the Property inspector in Adobe Dreamweaver CS6, you can format entire tables or individual table cells (and contents) by using CSS (cascading style sheets). In most cases, this is considered a better practice, as it maintains a separation between markup, content, and the actual styling used to make it aesthetically pleasing.

You can use CSS to format a table as follows:

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

  2. Under the Type category, select a size and color for your table’s text.

  3. Under the Background category in the CSS Rule Definition dialog box, assign a background color to your table by using the Background color property and then click OK.

  4. Select the table you want to apply the new Class style to.

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

    Your entire table takes on the new formatting.

    image0.jpg

Similar to the way you can use the Property inspector to color and align individual cells, you can create and apply CSS rules to table cells. In most cases, this is considered a better practice than relying on HTML attributes. To do this, just follow these steps:

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

  2. Under the Background category, select a Background color.

  3. Under the Block category, select Middle from the Vertical-Align drop-down list, select Center from the Text-Align drop-down list, and then click OK.

  4. Select the table cell that you’d like to apply the new class to.

  5. From the Property inspector, locate the Class drop-down list and select your new class.

    Your formatting choices are applied to the table cell.

    image1.jpg
  • Add a Comment
  • Print
  • Share
blog comments powered by Disqus
Advertisement
Advertisement

Inside Dummies.com

Dummies.com Sweepstakes

Win an iPad Mini. Enter to win now!