Firefox 11 Aurora中全新的开发者工具

开发 前端
Firefox 11 Aurora正式版将会在2012年3月正式发布。先睹为快,我们来看看Firefox 11中在开发者工具方面有什么亮点。

Firefox 11 Aurora 正式版将会在 2012 年 3 月正式发布。先睹为快,我们来看看 Firefox 11 中在开发者工具方面有什么亮点。

自由格式的样式单编辑

在***的Firefox 提供了 Style Inspector ,可以用它的规则来对某个元素的 CSS 属性进行查看和修改,而 Firefox 11 Aurora 将增加自由格式的样式编辑组合。

你可以从 Web 开发者菜单中打开 Style Editor ,如下图所示:

Style Editor 提供了一个 CSS 编辑的友好环境,你所作的修改会立即在页面上生效,你也可以在你本机上保存修改后的页面。

该工具还有很多好用的特性,例如点击 eye 图标可以对某个 CSS 属性进行设置和关闭,也就是我们常说的 toggle 操作。你可以在一个新页面上测试样式,或者创建一个新的样式或者直接从磁盘中加载样式。

另外,Style Editor 会自动对 CSS 进行排版处理,更适合阅读。

使用三维效果查看页面结构

哇塞,这个太酷了,你可以通过菜单中的 Web 开发者的 Inspect 来打开此功能,你将在工具栏看到一个 3D 按钮(前提是你的电脑兼容 WebGL),点击此按钮,就可以看到如下的酷图:

[[54522]]

你可以对此图进行缩放、旋转等操作。

下面是控制这个三维图形的操作方法:

Function Mouse Keyboard
Zoom Scroll up/down + and -
Rotate Click and drag a/d and w/s
Pan (none) Arrow keys

等不及想体验一下 Firefox Aurora 吗?

【编辑推荐】

  1. Mozilla技术布道者给Web开发者推荐Firefox插件列表
  2. 10款Firefox插件帮助Web开发者事半功倍
  3. 手把手教你快速开发新浪微博的Firefox插件
  4. 解决JS在firefox和IE下差异问题
  5. 解析JavaScript兼容性测试浏览器Firefox的用法
责任编辑:陈贻新 来源: 开源中国社区
相关推荐

2014-11-11 15:01:04

FirefoxMozilla

2013-10-24 09:46:01

Firefox开发者

2022-01-23 08:17:52

PowerToys工具Windows

2018-01-24 17:25:20

微软数据Desktop

2014-03-11 09:56:00

Firefox工具CSS

2011-04-18 09:27:07

FireFox发布通道Aurora

2012-12-24 13:23:31

Firefox浏览器

2018-12-17 16:54:50

开发者技能 Firefox

2021-08-01 22:59:16

Python工具开发

2011-06-22 10:35:02

FirefoxWeb

2013-03-19 14:28:24

Firefox浏览器

2015-08-05 10:43:40

开发者开发工具

2015-08-05 14:25:26

开发者开发工具

2012-06-13 01:23:30

开发者程序员

2019-11-14 14:44:32

开发者工具

2016-03-25 09:29:24

Apple开发工具开发者

2014-03-14 11:44:28

安卓开发者Android开发

2014-04-01 13:50:28

安卓Android开发者

2015-05-27 14:26:05

点赞
收藏

51CTO技术栈公众号