Confirmed users
64
edits
DevTools/Features/StyleInspector: Difference between revisions
Jump to navigation
Jump to search
DevTools/Features/StyleInspector (view source)
Revision as of 12:32, 7 November 2011
, 7 November 2011no edit summary
No edit summary |
No edit summary |
||
| Line 16: | Line 16: | ||
|Feature overview=The Style Inspector works in conjunction with the [[DevTools/Features/Highlighter|Highlighter]] to allow the user to view the CSS rules being applied to an element. It will be an updated version of the style inspector that shipped disabled in Firefox 4. | |Feature overview=The Style Inspector works in conjunction with the [[DevTools/Features/Highlighter|Highlighter]] to allow the user to view the CSS rules being applied to an element. It will be an updated version of the style inspector that shipped disabled in Firefox 4. | ||
The initial focus is on providing a property-oriented view. For example, you'll be able to look up the "color" property and see the | The initial focus is on providing a property-oriented view. For example, you'll be able to look up the "color" property and see the CSS selectors that went into deciding what color a given element should be. | ||
|Feature users and use cases=Users of all experience levels need to work with CSS. | |Feature users and use cases=Users of all experience levels need to work with CSS. | ||
| Line 59: | Line 59: | ||
See the [http://people.mozilla.org/~kdangoor/usecases/minotaur/steps/Fix_a_Font__Proposed_.html#The%20Style%20Inspector Mockup] in the Font Fixing use case section "The Style Inspector". | See the [http://people.mozilla.org/~kdangoor/usecases/minotaur/steps/Fix_a_Font__Proposed_.html#The%20Style%20Inspector Mockup] in the Font Fixing use case section "The Style Inspector". | ||
The Style Inspector displays a list of property/value pairs. Items in this list can be expanded to display the | The Style Inspector displays a list of property/value pairs. Items in this list can be expanded to display the CSS selectors that went into the final choice of the value and further expanded to display the rules that ''didn't'' go into the selected value. | ||
Ultimately, what we're going for is a cross between a computed styles view and a stylesheets-organized-by-properties view. | Ultimately, what we're going for is a cross between a computed styles view and a stylesheets-organized-by-properties view. | ||