# CSS Styles Window

The CSS Styles window enables you to edit the declarations of rules for HTML elements and selectors in a CSS file.

The upper pane of the CSS Styles window displays a list of the rules that are defined in the CSS file and the properties of elements that are selected when you use Inspect mode in the browser.

The lower pane of the CSS Styles window displays a list of the properties and values that are specified in the declarations of a rule.

The CSS Styles window contains the following elements.

Element | Description
--- | ---
Selection | Click this tab to view the properties of the selected element. The features in this tab are only available when you run an HTML5 project in a browser with NetBeans integration enabled and the Inspect function is enabled.
Properties | This table displays a list of properties of the selected element..
Style Element States | Click to toggle display of checkboxes for element states.
Applied Styles | This table displays a list of styles that are applied to the selected element.
Edit CSS Rules | Click to open the Edit CSS Rules dialog box.
Document | Click this tab to view the style sheets and CSS rules associated with the current file. Double-click a style sheet to open the stylesheet in the editor. Double-click a rule name to move the insert cursor to the line in the style sheet that contains the rule definition.
Filter Text Field | Type a string to filter the list of CSS rules and limit the list of displayed rules to the rules that contain the string.
Edit CSS Rules | Click to open the Edit CSS Rules dialog box.
Properties Toolbar | Use the icons in the toolbar to modify how the list of properties is displayed and to add new properties to the selected rule. The name of the selected CSS rule is displayed in the toolbar.
Filter Items | Click to toggle the text field to filter the list of properties.
Show Set Properties Only | Click to display only the properties that have a specific value.
Show Categorized Properties | Click to display all properties organized by category.
Show All Properties | Click to display all properties, listed alphabetically.
Add CSS Property | Click to open a dialog box that enables you to add properties to the selected rule that is displayed in the lower pane of the window.

To delete a rule, click the CSS rule in the toolbar and choose Delete Rule in the popup menu. To delete a property, right-click the property in the list and choose Remove Property in the popup menu.

Related Topics

Developing Applications with NetBeans IDE,

Copyright © 2016, Oracle and/or its affiliates. All rights reserved.