Chrome Web Inspector-左侧的CSS面板

我一直在研究定制ChromeWebInspector（尤其是），试图将Elements面板的CSS部分移到左侧，将HTML移到右侧，但我没有任何乐趣

有没有人设法让这样的东西起作用，或者看到过这样的例子

这是我想要得到的东西的一个快速剪辑

---

编辑：我正在使用Chrome的版本

18.0.1025.33 beta-m

，以防万一有任何版本特定的愚蠢：）

不知道你可以用Chrome设置web inspector的样式：p，下面是一些CSS，你可以添加到你的Chrome目录中找到的

自定义.CSS

样式表中，以呈现期望的结果：

Custom.css

---

从您提供的一个链接中，这里是

Custom.css

样式表的位置：

• Mac:~/Library/Application\Support/Google/Chrome/Default/User\ 样式表/Custom.css

• PC:C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css

• Ubuntu（Chromium）：~/.config/Chromium/Default/User\ 样式表/Custom.css

编辑：截图

---

这是一个可以在你的Chrome版本上使用的固定版本，在17.xxxx版本上试用过

CSS

#elements-content,
.scripts-views-container {
    left: 325px !important;
    right: 0 !important;
}

.split-view-sidebar-right  {
    float:right !important;
    right:auto !important;
    left:0 !important;
    width:325px !important;
}

.split-view-sidebar-left  {
    float:left !important;
    left:auto !important;
    right:0 !important;
}

.split-view-sidebar-left {
    border-right: 1px solid rgb(64%, 64%, 64%) !important;
}

.split-view-sidebar-left.maximized {
    border-left: none !important;
}

.split-view-sidebar-right {
    border-right: 1px solid rgb(64%, 64%, 64%) !important;
}

.split-view-sidebar-right.maximized {
    border-left: none !important;
}

---

几乎-元素面板是正确的，但是样式仍然像泰迪熊一样紧握着右边：/@Joe你使用的是什么版本的Chrome？18.0.1025.33 beta-m-它几天前刚刚自我更新，但正在运行beta分支。@Joe是的，我回家后会测试，为了测试的目的，我仍然在使用Chrome14，但是看看测试版中使用的最新css文件，他们改变了所有的类。只需更改ID以指向当前用于使其工作的类。太棒了，干杯。当我四处挖掘试图找到这些类时，我找不到正确的文件，很好地找到了它们：P它们在哪里？：）

#elements-content,
.scripts-views-container {
    left: 325px !important;
    right: 0 !important;
}

.split-view-sidebar-right  {
    float:right !important;
    right:auto !important;
    left:0 !important;
    width:325px !important;
}

.split-view-sidebar-left  {
    float:left !important;
    left:auto !important;
    right:0 !important;
}

.split-view-sidebar-left {
    border-right: 1px solid rgb(64%, 64%, 64%) !important;
}

.split-view-sidebar-left.maximized {
    border-left: none !important;
}

.split-view-sidebar-right {
    border-right: 1px solid rgb(64%, 64%, 64%) !important;
}

.split-view-sidebar-right.maximized {
    border-left: none !important;
}