CodeBurner for Firebug

CodeBurner 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.

Requires Firefox 3.0 or later, and Firebug 1.2 or later

New in Version 1.2

added support for Firefox 3.5
improved search algorithm gives better results
special search now includes "other attributes that are valid for this element" as well as those which are actually defined for it
code examples for CSS properties now include direct links to live examples online
original search term is now indicated in search results
slightly modified license clarifies the distinction between "use" and "redistribution"

Features (click on the images for a larger version)

Begin with the search box.	You can search for HTML elements, HTML attributes, or CSS properties (or any combination). The search happens live as you type, so usually you'll only have to type one or two letters to get the results you want.
Information is detailed but succinct.	Search results have information about browser compatibility, standards-compliance, and a brief summary of usage. There are also links to further information on the SitePoint Reference web site.
Context-menu options.	Right-click in the search results and you'll be given two options, one of which is for more information online, and the other is to show a code example for the selected item.
Practical code examples.	Code examples open in the side-panel of the Reference, HTML or CSS panels, and are practical examples with summaries, to show you how the item can be used. Code examples are also editable and easy to copy (simply double-click in Firefox 3 to Select-All).
Adding to the HTML context menu.	In the HTML panel you can right-click on any element name, attribute name or attribute value (include while it's being edited) and you'll have two options — to Look up the item you clicked on, or to Show Code Example for that item.
Adding to the CSS context menu.	Similarly, in the CSS panel you can right-click any property name or value, for the same options.
Searching for a selected element.	While in the HTML panel, if you right-click on the tag name of the element that's currently selected (usually highlighted in dark blue), the context menu will say Look up selection; clicking that will then do a special search — for the selected element, all the attributes that are defined for it, all other attributes that are valid for it, and all the CSS properties that currently apply to it. The special search also happens automatically — whenever you click the Reference tab, the panel will default to showing you data for the currently-selected element.
Code Examples follow Inspector.	While using the Inspector to select different elements, if the Code Example side-panel in the HTML panel is open, it will automatically bring up an example for whatever element is being inspected.
Adding to the crumbtrail options.	Likewise, the DOM crumbtrail responds to clicks to show code examples, if the Code Example side-panel is open. It also has context-menu items the same as the main HTML panel, with options to look-up the selected item or view a code example for it.

Licensing information

CodeBurner for Firebug is licensed under a modified Creative Commons Attribution-Noncommercial-Share Alike 3.0. You are free to copy, adapt, distribute and transmit the work, under the following conditions:

Attribution.: You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work).
Commercial use.: You may use this work for commercial purposes.
Noncommercial redistribution.: You may not redistribute this work for commercial purposes. For the purposes of this license, "redistribute" means to make copies and give them to other people; it does not mean making copies for your own private use, including local copies created during installation.
Share Alike.: If you alter, transform, or build upon this work, you may distribute the resulting work only under the same or similar license to this one.

In short: The license that comes with it is about how you can redistribute the extension, not how you can use it yourself.

Once you've installed it in your version of Firebug you can use it however you want - there's no restriction on what kind of projects you can use it with.

However, what you can't do is redistribute it as part of a commercial project. For example, a commercial gecko-based browser that bundled Firebug by default could not bundle this extension as well.