创建Ultimate Firefox Web开发配置文件

正确配置后,Firefox可以成为最终的Web开发工具,让您可以直接访问您正在处理的页面,以便您可以实时调整页面风格,调试JavaScript或甚至编辑HTML。

为Web开发创建单独的配置文件

安装所有这些开发工具将使Firefox成为一个非常沉重的浏览器,所以我们应该首先为Firefox创建一个新的配置文件。

您可以通过创建具有这些参数的新快捷方式,使用您的配置文件的名称替换WebDev,与常规配置文件同时启动单独的配置文件。 还有一个更详细的解释的如何做到这一点。

firefox.exe -P WebDev -no-remote

现在你已经使Firefox配置了一个单独的配置文件仅用于Web开发,让我们来看看我们可以使用的扩展,使Firefox成为最终的Web开发工具。

必须具有Web开发扩展

这些都是我定期使用的网络开发的扩展。

Firebug

Firebug是调试javascript,查看CSS和HTML的最强大的扩展。 您可以对代码和CSS进行动态更改,并使用它来调试Ajax代码。 这是真正的最好的扩展在那里。

图片

Web开发人员扩展

x年运行的最好的扩展之一。 这是任何开发人员必须拥有的,但你已经听说过了。

图片

Aardvark扩展

这个扩展是一个非常轻量级的扩展,将轻松地显示页面上的元素和他们分配的类/ id。 对于那些只需要元素的快速信息的时候,使用比Web开发者扩展更简单。 您还可以使用它从页面中删除元素。

图片

Colorzilla

轻松选择颜色。 没有更多的痛苦找到嵌入样式表中某处的颜色。

图片

查看源代码

您可以设置多个视图源配置文件以在不同的应用程序中打开源。

图片

HTML验证器

此扩展允许您轻松验证页面HTML并安装到“查看源代码”面板。

图片

Greasemonkey

它不是一个网络开发者扩展,但Greasemonkey是真棒,不仅是自动执行常见的操作的能力,这是一个伟大的时间保护程序为Web开发人员。

图片

测量它

使用此扩展名轻松测量屏幕上的距离。 测量区域后,您可以在屏幕上拖动矩形以用作比较。

图片

IE浏览器查看 / IE Tab键 / OperaView / FirefoxView / Safari浏览器查看 / IE浏览精简版

这些扩展(选择)让您可以轻松地在不同的浏览器中查看当前页面。 IE Tab甚至会让你运行IE里面的标签,如果你这么倾向。

图片

清除缓存按钮

清除缓存。 特别适用于检查新的CSS更改。

图片

重新启动Firefox

重新启动Firefox扩展非常有用,关闭和重新启动Firefox,所有选项卡和会话保持不变。

图片

Tab Mix Plus

Tab Mix Plus扩展是一个很好的扩展,但对于Web开发人员有一些基本有用的功能:复制选项卡和复制选项卡URL。

图片

YSlow

YSlow扩展是雅虎的一个新扩展,将分析您的页面,告诉你在哪里犯错误。 它甚至会给你的网站性能的成绩。 你会注意到在右下角的小规格...它告诉你的页面的总大小和加载时间。 非常有用的扩展,但它需要Firebug扩展。

图片

Dummy Lorem Ipsum

Dummy Lipsum generator扩展会根据着名的Lorem Ipsum文本为您生成虚拟内容,这对于在您的网站中布置虚假内容非常有用。

图片

Screengrab!

Screengrab扩展将允许你截取页面,但可以做一些常规的屏幕截图工具不能 - 它可以拍摄整个页面的图像,而不只是可见的部分。

图片图片

有很多其他扩展,你可以使用,但这些是我见过的最好的最好的。 如果您有另一个经常使用的分机,请在注释中留言。

在这一点上,您现在已经将Firefox转变为极致的Web开发工具。 花时间学习如何使用Firebug特别。

赞 (0)
分享到:更多 ()