Inspect and modify element styles

Use the Web Inspector Styles pane to inspect and modify styles.

To inspect and modify styles:
  1. Click the Elements icon on the toolbar to display the Elements panel.
  2. In the document pane, locate and select the element with the style you want to modify.
  3. In the data sidebar, expand the Styles pane to display the style declarations applied to the selected element.
  4. Perform any of the following actions:
    • To change the value for a style declaration, double-click the value in the Styles pane to make the value editable, then type the new value. You can use the Tab key to cycle through the declarations within a selector to modify more than one value.
    • To disable a style declaration, deselect the adjacent check box.
    • To add a new style declaration for a selector, double-click the white space below the last style declaration, then type the new declaration.
    • To modify the selector, double-click the selector, then type the new selector value.
  5. When you're done, propagate your changes to the source document.