如何重新定位Chrome开发工具

这些工具默认在chrome窗口的底部打开。对于宽屏幕显示来说，这是一个相当糟糕的选择，因为右侧有大量的空白空间，但没有太多的垂直空间。不幸的是，我找不到重新放置工具的方法。我想把它们放在一边，类似于firebug。

唯一的选择类似于我想要的是分离开发工具和放置chrome和工具窗口并排。这对于快速地从IDE切换到浏览器并返回alt选项卡不是很方便，所以一个“集成”的解决方案会很好。

198970 次浏览
小开
最佳答案

Chrome 46或更新版本

单击垂直省略号按钮()，然后选择所需的对接选项。

.

Chrome 45或以上版本

长按右上方的dock图标。它会弹出一个选项来更改对接

.

要更改HTML和CSS面板之间的分割，请在DevTools中选择“设置(F1) > General > Appearance > Panel Layout”。

小开

看起来左下角现在是一个带有重叠窗口的图标和“卸载到单独的窗口”工具提示。

enter image description here

小开

在我把我的码头放在右边之后(见以前的答案)，我仍然发现面板垂直分裂。

要水平拆分面板——甚至可以从屏幕宽度中获得更多——请转到设置(右下角)，并取消“当停靠到右侧时垂直拆分面板”的检查。

现在，你有了从左到右的所有面板:p

小开

将指针放在停靠按钮上，长按(几秒钟)或右按&鼠标左键单击取决于浏览器版本。

enter image description here enter image description here

小开

截至2014年10月，版本39.0.2171.27 beta(64位)

我需要进入Chrome Web developer的“设置”，取消勾选当停靠到右侧时垂直拆分面板

小开

键盘快捷键切换对接位置(侧/下)

<强> CTRL < / >强 + <强> < / >强转变 + <强> D < / >强

有很多捷径你可以去看看

设置»快捷键，如下所示 Settings截图

或者，使用<强> CTRL < / >强 + ?进入设置，从那里可以到达左边的“快捷方式”子项或使用官方参考。

小开

我现在所在的版本56.0.2924.87，如果你不在桌面，会自动卸载DevTools。否则，打开一个新的Chrome选项卡和检查停靠到DevTools回到窗口。

小开

此外，如果你想在一个窗口中看到源代码和控制台，请转到:

“自定义和控制DevTools ->”显示控制台抽屉

你也可以在右上角看到它:

< / >

小开

如果你使用Windows，当devtools打开时，会有一些快捷方式:

按Ctrl+转变+D将依次将所有devtools停靠在左、右、下。

如果你的JS控制台消失了，按Ctrl+转变+F，你想让它在开发工具中停靠回底部。


提交答案