Google Chrome开发者工具中的指南/缩进行

Question

是否可以在Google Chrome开发工具中添加指南/缩进线？查看附图。

我在寻找它已经很长时间了，但那里什么都没有。

这对网络开发过程非常有帮助。

Answer 1

我不知道有什么方法可以显示所有指南，但 DevTools 已经在某种程度上做了你想做的事情：

• 选择元素标签。
• 选择并展开任何带有三角形的元素，将显示垂直指南。
• 将鼠标悬停在任何从属元素上，并显示第二个较暗的指南。

这是一个屏幕截图：

指南在屏幕截图中不是太明显，所以我添加了两个大的红色箭头指向它们，但它们更容易在实际屏幕上看到。

我没有使用任何主题，因此您可能因为您使用的黑暗主题而无法看到这两个指南？如果是这样，请尝试使用其他主题，或根本不使用主题。