![]() ![]() In the Style Inspector, you can switch from “Rules” to a “Properties” section that gives you the computed CSS properties for the selected element, along with links to Mozilla’s documentation for each property. ![]() Clicking the “Inspect” button lets you hover over elements to inspect them, and as you do so, Firefox highlights the element you’re inspecting and darkens the rest of the page.Ĭlicking the “Style” button brings up the Style Inspector, showing the CSS rules that apply to the selected element. In this view, you can expand and collapse tags and edit their attributes. If just you want to see the DOM, having to click “HTML” first may drive you up the wall.Ĭlicking the HTML button bring up a panel that shows the hierarchy of HTML tags that make up your page. There are also buttons labeled “Inspect,” “HTML,” and “Style.” If Firebug’s sea of tabs and buttons drove you up the wall, this layout will be a godsend. You can click parents or children to select them, and you can right-click an element to see its siblings. You can pull up the Page Inspector by right-clicking a web page and choosing “Inspect.” (Firebug recently changed its context menu item to read “Inspect in Firebug,” so it will coexist peacefully with the built-in dev tools.) At the bottom of the screen, a purple bar appears with a list of the selected element’s parents and children. Rather than try to reproduce Firebug or the WebKit developer tools, Mozilla has included only the most essential features, focusing instead on making the experience elegant.ĭoes the new approach work, or will designers run screaming back to Firebug? Let’s take a look. ![]() In some ways, these tools are similar to Firebug, but they’re also uniquely Mozilla-ey. Firefox 10, due out January 31st (the same day Firefox 11 becomes an official Beta release), finally rounds out the browser’s growing collection of developer tools with Page and Style Inspectors.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |