by 
Of the many Add Ons that I have installed, one of the ones that I find myself using the most frequently in my current work is FireBug. For me, web development will never be the same.
What is it? FireBug is a panel (or separate window) that gets added on to your browser that tells you everything you need to know about what it going into the making of the page you are viewing. The panel displays the HTML code (when you hover over the code, it highlights the area on the screen that is being generated by the code), CSS (you can see the cascading and hide, add, change styles and see them represented on the fly), and scripting languages.
Network Usage
Ever wonder just how long your site is taking to render in the browser and what components are the slowest? FireBug will monitor the site’s loading and show you with a graph just what pieces take the longest. It is with FireBug that I found that the “Add to Netscape” button I had on the site a little while ago was really slowing me down!
Inspect
I use this one all the time. Point your mouse to an area of the screen and FireBug will take you to the exact HTML and CSS for the item and show you how it’s being made. I use this to find problems in HTML or to figure out the code behind someone’s great display in the way I talked about last week.
This Add-On may open the door to HTML for you– it’s certainly something that’s fun to play with for the novice, and a must have to the web developer.
Thanks for this tip. I have installed it.
That’s pretty interesting.
Firebug also has a JavaScript debugger. For anyone who has ever written JavaScript, it can be a pain to debug! Firebug makes it easy. It has literally saved me days of debugging while I’ve worked on projects.
I use it to figure out just what sites or doing or troubleshooting. I don’t know what I did without out– it makes things so much easier.