怎样使用Firebug图文详解

Firebug本是Firefox浏览器下一个出色的网页设计插件。在此就简要介绍下Firebug的安装和基本使用

1、Firebug的安装。安装完毕最新版火狐浏览器后（本例版本为5.0.1），点击左上角firefox菜单，选择附加组件，如下图：

2、之后在出现的搜索栏中输入“firebug”关键词，出现firebug搜索结果，点击安装后，重启浏览器即可完成安装过程，如下图：

 

3、Firebug的启动完成安装，重启浏览器后，即可按“F12”快捷键启动Firebug插件，也可点击firefox地址栏右边firebug图标启动，启动后，页面将分栏显示，Firebug各项功能显示在下方，如下图所示：

 

 

4、Firefox的主要菜单选项有控制台、HTML、CSS、脚本、DOM、网络六个，上述功能的配合使用能够满足网页设计的各项要求。

   （1）控制台（Console）功能：控制台得主要作用是用来显示网页各类错误信息，并可对日志进行打印处理。同时可以在进行javascript调试的时候当作命令行窗口使用，并通过概况子选项说明javascript代码执行的相关信息。

   （2）HTML功能：此菜单标签功能，主要用于查看当前页面的源代码功能，并可进行编辑，时时显示，从而实现页面最佳效果。启用此标签后界面如下：

               

    （3） CSS功能：点击CSS菜单标签，可查看所有的CSS定义信息，同时也可以通过双击来达到修改页面样式的效果，如下图所示：

           

   （4） 脚本（Javascript）功能：脚本功能主要是一个脚本调试器，可以进行单步调试、断点设置、变量查看等功能，同时通过右边的监控功能来实现脚本运行时间的查看和统计，提高运行效率，如下图所示：

           

       

   （5）DOM功能：该功能主要用于查看页面DOM信息，通过提供的搜索功能实现DOM的快速准确定位，并可双击来实现DOM节点属性或值的修改，如下图：

         

    （6）、网络（Net）功能：该标签功能主要用来监控网页各组成元素的运行时间的信息，方便找出其中运行时间较慢的部分，进一步优化运行效率，如下图：