如何在Chrome Developer Tools中查找任何元素的计算大小？

Question

我确定这是开发人员工具检查器中的某个地方，但我找不到它。对于给定的元素（例如，div），我会在哪里找到我右键单击并选择“Inspect Element”的给定元素的计算尺寸（高度和宽度）？

Answer 1

将鼠标悬停在开发人员工具面板下方功能区中的元素名称上。相应的元素将在浏览器窗口中突出显示，尺寸显示在它的一角。此外，如果您向下滚动开发人员工具中的右侧窗格，您将会看到“指标”＆＃39;窗口，它将为您提供计算的尺寸以及边距，填充，边框等。

这是包含您的SO问题的div维度的屏幕截图。当我将鼠标悬停在底部的div名称上时，请注意突出显示区域左下角的尺寸。右侧是Metrics窗口。

Click here for bigger image

对于将来的问题，请先参考Google的nice documentation。