Setting Off Some of the Class Styles Using the Tag Inspector

As experienced CSS users will have noticed, the choices immediately available within the Property inspector are limited solely to common appearance choices available for text. Let’s set off some of the class styles we have already developed by breaking out the Tag inspector.

1. Choose Window > Tag Inspector if necessary to enable this panel group.
2. In the Tag inspector panel group, select the Relevant CSS tab.
3. Click either within the table cell or the paragraph that has the dullndark class applied.
4. Although you can make the changes to that particular class within the Relevant CSS panel, let’s use the CSS Properties panel by double-clicking the dullndark class in the Relevant CSS panel.
5. As the CSS Properties panel appears, the page switches into Code view and navigates to the code for that style. Navigate to the Border category.
6. Set the following border settings:
• Border-left-color: #996633
• Border-left-style: solid
• Border-left-width: thin
7. Switch to Design view (or click in the body of the code in Code view) to switch the panel back to the Tag inspector panel group.
8. Save sampler.htm.

The one drawback to this methodology is that you will write styles to the document head itself. You will best leverage the power of CSS if you create external CSS files and link to them, rather than define styles within each page. Although Dreamweaver allows you to export CSS styles to an external style sheet, once they are defined internally, doing so does not remove the internal style sheet code in the head of the document. Could that cause problems later? You betcha!