自定义 Chrome 网络检查器的外观答案

【问题标题】：Customise the look of the Chrome web inspector自定义 Chrome 网络检查器的外观
【发布时间】：2011-11-01 05:50:03
【问题描述】：

我已经厌倦了我似乎每天在使用 Firefox 时遇到的众多问题，我正在尝试再次切换到 Chrome。

让我感到沮丧的一件事是检查器中选项卡的布局。在萤火虫中，它们都在顶部，所以如果我想要一个项目的指标，它非常简单。在 Chrome 中，我一直在上下滚动。

有没有办法改变它的工作方式？我要做的就是将布局更改为类似于 Firebug 的布局。

干杯！

【问题讨论】：

【解决方案1】：

Chrome 网络检查器只是一个网络应用程序，因此非常可定制。您可以下载 devtools HTML/CSS/JS 的副本，并告诉 Chrome 将其与命令行标志一起使用。一些资源：

【讨论】：

【解决方案2】：

开发工具只是 CSS/JavaScript，因此您可以随心所欲。

如果您观看此video，Paul Irish 将展示如何运行 Chrome 构建并指向您自己的开发工具代码。有点酷！

【讨论】：

【解决方案3】：

devtools CSS 位于chrome-devtools://devtools/devTools.css（将地址复制并粘贴到地址栏中）。

使用Custom.css 覆盖样式：

C:\Users\<user>\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets 在 Windows 上
~/Library/Google/Chrome/Default/User StyleSheets 在 OS X 上

【讨论】：