CSS Properties panel
You can use the CSS Properties panel in tandem with an open web page, external CSS file, or with the Manage Styles panel to review and change the properties and values of existing styles.
When you use the CSS Properties panel with a web page, the panel enables you to quickly see all of the styles that the current selection in your web page uses, the order of precedence of those styles, and all of the properties and values of those styles.
Note
If a CSS property is not supported by the CSS schema that is selected in the Authoring tab of the Page Editor Options dialog box, the list of values for that property appears blank in the New Style and Modify Style dialog boxes and the property is not listed in the CSS Properties panel.
For more information, see Set IntelliSense options for CSS.
CSS Properties panel
The Show categorized list button The Show alphabetized list button The Show set properties on top button |
|
The Summary button lists together, under the CSS Properties column, all of the properties that affect the current selection, instead of only the properties of a selected style. In summary mode, you can click a property under CSS Properties to outline the associated rule under Applied Rules. To get out of summary mode, click Summary again or click a rule under Applied Rules. |
|
Applied Rules lists the selector of each style that affects the current selection. Styles are listed in ascending order of precedence, from lowest precedence at the top of the list to highest precedence at the bottom. Point at a selector to see the entire rule set in a ScreenTip. Select a selector to display its properties under CSS Properties. Double-click a selector to go to the code of that rule set. |
|
This column lists the tag to which each style is applied and the selector of the style. Point at a row in this column to see the applied rule. The column is labeled Current Page when the selected style resides in an internal CSS or labeled with the name of an external CSS file when the selected style resides in an external CSS. You can point at the external CSS file name to see the path to the file or click the external CSS file name to open the file. |
|
CSS Properties lists the values of properties you've set in the style selected under Applied Rules and also all unset properties. Double-click a property to go to the code of that rule set. |
|
When the Show categorized list button |
|
You can set the value of a property by, in the box next to the property name, typing a value or pointing at the box and then clicking, when available, the drop-down arrow |
|
Properties that have a red line through them are set by the selected style but either aren't inherited by the current selection or are overridden by another style. To see a ScreenTip that provides more information, point at a crossed-out property. The ScreenTip for overridden properties identifies the overriding property. ![]()
In the CSS Properties panel, to display a shortcut menu that contains additional options for working with your CSS, right-click a selector under Applied Rules.
|
See also
Tasks
Modify a style
Create a style
Remove a style from content
Set IntelliSense options for CSS
Reference
Concepts
Cascading style sheet reference
Send feedback about this topic to Microsoft. © 2011 Microsoft Corporation. All rights reserved.