IE Developer Toolbar

From Wikipedia, the free encyclopedia

IE Developer toolbar showing the accesskeys, source and CSS selector matches in a Wikipedia article
IE Developer toolbar showing the accesskeys, source and CSS selector matches in a Wikipedia article

Microsoft made available the Internet Explorer Developer Toolbar (sometimes shortened to IE Developer Toolbar), on May 7, 2007,[1] as an add-on for Internet Explorer 6 and Internet Explorer 7 that aims to aid in design and debugging of web pages. It allows validating of CSS and HTML, previewing page layout at various resolutions, [2] and also offers a ruler (measuring in pixels) to aid in positioning the elements.[3] It allows viewing the source of the entire page, color coded for ease of navigation, or selected elements of it, as well as view the DOM source and the CSS selectors that were applied to the element. It also enables viewing the properties and styles of individual elements and also trace styles of elements to its declaration.[4]

The toolbar installs a button in the IE command bar, which toggles a flyout pane at the bottom of the window. The IE Developer toolbar pane shows the structure of the web page, and for each structure the proerties and styles. It exposes its features through a menu hierarchy, and also includes toolbar buttons for quick access to features like clearing the browser cache and enable selecting elements by clicking in the rendered page, rather than navigating through the visual representation of the DOM tree.[5]

In the Internet Explorer 8 Beta 1 the toolbar was included in the installation, rather than as a separate download. [6] One dev blog noted, "Instead of having to find, download, and install a separate debugging application, just press SHIFT+F12, or click the developer tools icon in the command bar." [7]

[edit] References

[edit] External links