有没有办法在 Chrome 开发者工具中隐藏盒子模型图形？

Question

我想知道是否有人知道隐藏或删除过滤器上方“计算”选项卡顶部的盒模型图形的方法？它是显示边距/边框/填充和尺寸的图形。这对我来说没有用，我希望有额外的十几行过滤器。

我每天花大约 4 个小时在 Chrome 的开发工具上，这只是那些小挫折之一，如果能解决就好了。

谢谢！

Answer 1

我为此目的创建了一个扩展，因为这让我紧张了很长时间。

这是我的解决方案：

body
  .root-view
  .tabbed-pane[slot="insertion-point-sidebar"]
  .style-panes-wrapper[slot="insertion-point-sidebar"]
  .vbox:first-child {
  display: none;
}

将其放入扩展程序中的 CSS 文件中，通过 JS 加载它，基本上就完成了。

对于每个不想重新发明轮子的人，这是我制作的开发工具扩展：https://chromewebstore.google.com/detail/eoponiimbhcmaenjpdedhfknijgjcjcf