beautypg.com

The css styles panel – Adobe Dreamweaver CC 2014 v.13 User Manual

Page 190

background image

The CSS Styles panel

To the top

The CSS Styles panel in Current mode
The CSS Styles panel in All mode
CSS Styles panel buttons and views
Open the CSS Styles panel

Note: In Dreamweaver CC and later, CSS Styles panel is replaced with CSS Designer. For more information, see CSS Designer.

The CSS Styles panel lets you track the CSS rules and properties affecting a currently selected page element (Current mode), or all of the rules
and properties that are available to the document (All mode). A toggle button at the top of panel lets you switch between the two modes. The CSS
Styles panel also lets you modify CSS properties in both All and Current mode.

The CSS Styles panel in Current mode

In Current mode, the CSS Styles panel displays three panes: a Summary for Selection pane that displays the CSS properties for the current
selection in the document, a Rules pane that displays the location of selected properties (or a cascade of rules for the selected tag, depending on
your selection), and a Properties pane that lets you edit CSS properties for the rule applied to the selection.

You can resize any of the panes by dragging the borders between the panes, and can resize columns by dragging dividers.

The Summary for Selection pane displays a summary of CSS properties and their values for the item currently selected in the active document.
The summary shows the properties for all rules that directly apply to the selection. Only set properties are shown.

For example, the following rules create a class style and a tag (in this case paragraph) style:

.foo{

color: green;

font-family: 'Arial';

}

p{

font-family: 'serif';

font-size: 12px;

}

When you select paragraph text with a class style of .foo in the Document window, the Summary for Selection pane displays the relevant
properties for both rules, because both rules apply to the selection. In this case, the Summary for Selection pane would list the following
properties:

183

This manual is related to the following products: