Firebug Tutorial

What is Firebug?

Firebug is an open source web development tools.

In this chapter we will discuss the following tutorial:

• How to install Firebug.
• Use Firebug to inspect and edit HTML.
• Use Firebug to inspect and edit CSS.
• Use Firebug to debug JavaScript.
• Dynamic Execution JavaScript in Firebug.
• Using Firebug Javascript log record.
• Use Firebug to monitor the network.

Install Firebug

Firebug Download: https://addons.mozilla.org/en-US/firefox/addon/1843/

Use Firefox browser to access the address above to download, open the page, click on the download button, there will be a pop pages, prompt installation directory, after installation restart your Firefox browser.

After the restart can see Firebug icon in the Firefox browser. Click the Firebug icon (located in the upper right corner Firefox browser) to activate Firebug plug-in.

Firebug assembly

Firebug Options

On the page, click Inspect Element

Undo and Redo

Displays the command line

Selection panel

Console

HTML panel

CSS panel

Scripts panel

DOM panel

Network Panel (for web speed and optimization)

Other buttons

• 1-- minimize Firebug.
• 2 - Install Firebug in the browser window.
• 3 - Disable Firebug.