2.3 CSS Editor

The CSS Editor uses the normal text editor, but it also supplies a second, nontextual view. Whenever you are editing a CSS file, an extra tool window called CSS Outline will be available, presenting a tree view of the CSS file, as Figure 2-9 shows. By default, this view will be docked to the left of the screen, but since it is a tool window, you can dock it anywhere or undock it completely.

Figure 2-9. CSS Outline

There is also a visual code generator for CSS. When you select a CSS style in the text view, you can select Build Style... from the main Style menu or from the context menu. This will display a dialog that lets you edit the style visually. You can also select Styles Style Rule to add a new style rule. You can preview your stylesheet by selecting View in Browser from the context menu. By default, this will show a test page that contains text with a variety of styles, but you can choose your own preview page by going to Styles Select Preview Page.