google-chrome - 为什么我无法获得 google chrome CSS Grid Inspector？

Question

我一直在尝试将 CSS 网格检查器用于 google chrome 开发工具。但是，我既不能得到元素旁边的网格标签（正如开发工具必须显示的那样），也不能得到我应该能够使用网格间隙、行等的布局面板。

如何启用/使用它们？

Google Chrome 版本 86.0.4240.75（官方版本）（64 位）

我尝试关注的文章：https ://developers.google.com/web/tools/chrome-devtools/css/grid

标签： google-chromegoogle-chrome-devtoolsdevtools

Answer 1

启用该功能的方法没有很好地记录。

1. 选择Control+Shift+I（Windows、Linux）或Command+Option+I（macOS）
2. 选择Shift+?以显示“设置”面板
3. 导航到实验和...
4. 选中“启用新的 CSS 网格调试功能（重新启动后元素的布局侧边栏窗格中可用的配置选项）”

重新启动开发工具后，您应该会在元素资源管理器中看到小的网格标签，并在开发工具侧边栏中看到新的布局窗格。

高温高压

顺便说一句，它应该是版本 87 的默认值...