This extension comes shortly after the announcement that Sitepoint have put up their JavaScript Reference.

The new extension pulls in information from their reference, at the moment it only works for the HTML and CSS reference, but once the JavaScript reference is more complete we might see that integrated as well.

FireScope is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS. The extension’s core functionality is centered around a new Reference panel, which contains a search tool for looking up HTML elements, attributes, and CSS properties. The extension also hooks into context-menus in the HTML and CSS panels, the DOM crumbtrail, and the Inspector, adding options to look up a selected item ie. search for it in the Reference panel or to view a code example.

At first glance, this little addition to Firebug/Firefox doesn’t strike one as more than just a gimmick, but it’s usefulness soon becomes apparent when trying to find out more about a CSS property or HTML element.

All in all most of us who are hardcore HTML and CSS programmers won’t always find the reference that fantastic, but it’s of course for those little used elements and properties where the reference is useful (when was the last time you used the CSS clip property? Anyone?).

One of the more useful things I’ve already become fan of, is the browser support table shown for elements and properties. This allows you to quickly see if there is a buggy implementation, or perhaps only partial support in certain browsers for whatever it is you’re trying to do.