Web Developer插件概要_Div+CSS教程

Web Developer 插件以工具栏的形式对网页的(X)HTML、脚本、多媒体、CSS、缓存、图象等多方面的实用工具。使我们能轻易的获得网页的更多信息，使我们进一步的了解当前所浏览的网页。

在Web Developer 插件工具栏中，主要由以下几个部分组成：Disable、Cookies、CSS、Forms、Images、Information、Miscellaneous、Outline、Resize、Tools、View Source、Options。下面我们就对其概况进行介绍。

Disable禁用工具　　可以暂时的屏蔽当前页面中的某些东东，如JavaScript脚本、缓存、mete自动重新定向、将网页显示为黑色（图片除外）、禁用弹窗等等。如下图：

 

Cookies工具　　可以用此工具查看当前页面的Cookies信息，可以按不同的域名或路径进行查看，而且可以手工增加一个Cookies，这对于后台网络编程的开发调试来说是非常方便而得力的工具。如下图：

 

CSS样式表工具　　这是一个非常强大的工具，基于CSS网页布局有这个得力的助手，工作与学习都将变的非常简单，可以控制CSS是否应用，查看页面的CSS文件，并进行实时的编辑，并在浏览器窗口中立即反应出编辑后的效果。关于此工具的详细介绍：Web Developer插件 CSS工具组教程

Forms表单工具　　其主要作用是对页面的表单进行控制，其中的很多功能对于表单程序的开发有着非常非常大的帮助，由于我们的重点是CSS网页布局，此工具我们不作深入的探讨。如下图：

Images图像工具　　可以对当前页面的图像进行设定，可以显示所有图片的alt信息，对背景等也可以进行是否显示的设定。如下图：

Information信息工具　　此工具在我们的CSS网页布局设计中也经常用到，我们可以用它来查看页面中所有的id、class及table等元素的名称、占位等信息，关于此工具的详细介绍：Web Developer插件 Information工具教程

Miscellaneous其他　　这是一个非常“好玩”的工具，它所提供的功能是我们所梦寐以求的，在页面布局中，我们可以用它来达到很多有意思的功能，如辅助线、面积、测量等，我们在CSS网页布局设计中也经常用到，关于此工具的详细介绍：Web Developer插件 Miscellaneous工具教程

Outline线框工具　　这组工具对我们CSS网页布局设计是非常有用的，线框显示工具能够将页面中的某些元素使用线框描边，使我们可以更好的查看其占位信息，我们可以使用它给div、h1-h6、表单等进行线框描边，关于此工具的详细介绍：Web Developer插件 Outline、Resize工具教程

Resize尺寸工具　　我们可以用它来改变浏览器窗口的尺寸，如果我们使用了1600*1200的分辨率，我们可以借助此工具来模拟1027*768的窗口效果。关于此工具的详细介绍：Web Developer插件 Outline、Resize工具教程

Tools工具　　对于我们CSS网页布局设计，它的最大功能在于将CSS及XHTML校验工具整合在一起，可以点击此工具中的校验选项对当前页面进行检验，它会自动链接到相关校验页面，并返回校验结果。如下图：

View Source查看源代码　　用于查看页面的源文件。

Options选项　　用于Web Developer 插件的参数设置。如下图：