如何重新定位Chrome开发者工具

kos*_*tja 481 google-chrome google-chrome-devtools

默认情况下,工具在chrome窗口的底部打开.对于宽屏显示器来说,这是一个相当糟糕的选择,因为右侧有足够的空间,但没有多余的垂直空间.不幸的是,我找不到重新定位工具的方法.我想把它们放在一边,类似于萤火虫.

类似于我想要的唯一选项是分离开发工具并将chrome和工具窗口并排放置.这对于从IDE到浏览器的快速alt-tabbing并不是很方便,因此"集成"解决方案会很好.

loi*_*slo 884

Chrome 46或更新版本

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

Chrome 45或更早版本

长按右上角的停靠栏图标.它弹出一个选项来改变对接

要更改HTML和CSS面板之间的拆分,请转到DevTools到设置(F1)>常规>外观>面板布局.

  • 多么可怕的设计!我无处可见.在其他任何地方我都看不到这种情况并等待使用过. (11认同)
  • 在最近的chrome和canary版本中,该选项已被删除,但您仍然可以通过单击并按住左下方的停靠图标来访问它,它会弹出一个选项以停靠到右侧. (8认同)
  • @blrbr是的,如此真实.如果您需要进行谷歌搜索只是为了找到如何激活您知道存在的选项,那么UI设计就会出现问题.这里的关键字是'可发现性'.这是不容易发现的. (4认同)
  • 很酷,它存在于稳定版本中,我根本不知道它,有更多不错的选择:)谢谢 (2认同)
  • 很酷,靠近右边工作.现在,如何将"元素"选项卡上的CSS检查器移动到开发工具窗格的底部?否则,我必须在非常窄的列中并排查看HTML和CSS. (2认同)

小智 70

将指针放在停靠按钮上并长按它(几秒钟)或左右鼠标单击,具体取决于浏览器版本.

在此输入图像描述 在此输入图像描述


Alu*_*tha 41

用于切换停靠位置的键盘快捷键(侧面/底部)

CTRL+ SHIFT+D

你可以通过许多快捷方式看到它们

设置»快捷方式,如下所示:
设置截图

或者,使用CTRL+ ?转到设置,从那里可以到达左侧的"快捷方式"子项或使用官方参考.

  • OSX上的⌘-Shift-D也是如此. (5认同)
  • 如果您根本无法打开底座,请尝试"Ctrl + Shift + I" - 但如果您的窗口是弹出窗口,我认为对接甚至不起作用. (2认同)

bri*_*n_d 18

看起来这个位于左下方,现在是一个带有重叠窗口的图标和"Undock into separate window".提示.

在此输入图像描述

  • 您可以澄清,您必须单击并按住此按钮才能停靠在右侧.正如@PaulSpencer注意到的那样,只需点击停靠点即可. (13认同)

小智 11

我把码头放到右边后(见旧答案),我仍然发现面板垂直分开.

要水平分割面板 - 甚至从屏幕宽度中获得更多 - 请转到"设置"(右下角),然后取消选中"停靠在右侧时垂直拆分面板".

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


Pie*_*oui 8

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

我需要将Chrome Web Developper平移进入"设置",并在停靠到右侧时取消选中垂直拆分面板