问题标签 [inspector]

有没有办法在 Chrome WebKit 检查器的元素视图中展开所有元素？

我知道可以在使用 WebView 的 OS X 应用程序中包含 WebKit Dev Tools Web 检查器。我在用着：

这允许我通过在 WebView 中单击鼠标右键来激活检查器。

有没有办法从按钮或菜单项启动网络检查器？我找不到任何关于此的文档。

谢谢，查理

我在笔记本中使用自定义 css，但似乎我没有正确覆盖默认 css。我的代码单元格如下所示：

当我执行它们时，它们会在底部添加一些空间，其中似乎包含原始输入格式：

我想摆脱这个。

使用 firefox 的 Inspector，我可以看到div.input_area与下面未执行的单元格中的相同元素相比，该元素被放大了：

在标题为“设置”的部分中，放大的 div 以淡蓝色突出显示。“定义一些辅助函数”部分下的相同元素具有正确的大小。

一旦我双击放大的单元格，它就会再次正确显示。

是什么导致div.input_area元素尺寸增加或者我可以做些什么来找到原因？

编辑：

我刚刚发现的父母div.input_area有一个-moz-box-flex: 1财产。当我取消选中此选项时，单元格会水平收缩以适应内容（我不想要），但也会覆盖先前添加的额外空间。它看起来像这样：

有没有办法在 Thunderbird 中检查 HTML 电子邮件。在我的情况下，在 Mac 上。

我收到仅在 Thunderbird 中出现的错误（错误渲染），因此如果可能，我需要在那里进行检查。

我目前正在研究 Ember.js，使用 Yeoman 作为项目部署的自动化工具。由于 Grunt 已经包含在 Yeoman 中，所以每次我在处理我的项目时，我都会使用它来启动 Grunt 服务器。

我刚刚开始使用 Yeoman 开始我的第一个 Ember.js 项目，当时我意识到，当我在 localhost 上运行 Grunt Server 时，Chrome 的 Ember Inspector Extension 无法将我的应用程序检测为 Ember.js 应用程序。我已经检查了扩展设置中的“允许访问文件 URL”选项，仍然没有检测到。当我在不运行 Grunt 服务器的情况下处理项目时，Ember Inspector 会立即检测到我的应用程序。

在运行 Grunt 时如何使用 Inspector 的任何解决方案？

我可以通过 + 号（新样式规则）添加常规样式规则，但不能在样式检查器的“伪 ::before 元素”或“伪 ::after 元素”部分下添加一个。如果我尝试通过“编辑为 HTML”将::beforeor元素添加到 HTML 中，它会以文本形式出现。::after我的解决方法是添加<span class="pseudo_before"></span>然后设置样式。我错过了什么吗？

我对 Chrome 检查器如何生成 CSS .class 路径有疑问。

当我为一个类添加样式规则时，我想要“.classname”而不是（例如）“body > div.classname”。请参阅所附图像。

我似乎在检查器属性面板中找不到任何选项来禁用它。有小费吗？

由于 Firefox 将自身更新到版本 28（在 Windows 7 上运行），我无法使用 Firebug 快捷方式进行元素检查（Ctrl++ Shift）C。当我按下这个组合键时，会弹出默认的开发者工具窗口。在早期版本的 Firefox 中，只需在 Firefox 的开发工具设置中取消选中/禁用检查器工具即可解决此问题。但是，此复选框不再存在：

我尝试了以下方法：

• 重新安装 Firefox 和 Firebug。
• 在about:config中，我搜索devtools.*.enabled并将所有值设置为false。
• 我下载了一个名为Customizable Shortcuts的插件，但是更改任何快捷方式都没有解决我的问题，新的快捷方式无法被识别。
• 在默认的 Firebug Shortcut Bindings 窗口中，更改任何快捷方式都不会影响任何内容，同样，新的快捷方式也不会被识别。

即使我将 Firebug 检查器绑定到未使用的快捷方式（即Ctrl+ Shift+ Alt+ 6），它仍然无法被识别：

看起来 Firebug 无法分配任何组合键，或者可能还有其他事情发生。

任何帮助，将不胜感激！

The Firefox Web Developer's Toolbar had an option under Information to see the topographical information about a page: what's inside of what. Is there any way to see that with Chrome's Dev Tools?

I installed the Web Developer's Toolbar on Chrome but can't see any way to turn the toolbar on. Then I found something from 2013 about Google disabling toolbars.

So, is there a way to see what elements are inside of what elements with Chrome?

I'm using Chrome 34.0.

Thanks