Sofia Emelianova
Chrome 开发者工具提供多种可视化选项，可直观地调试 CSS 网格布局。
观看视频，了解如何在元素面板中切换网格叠加层，以及如何使用网格叠加层：
- 直观呈现和检查网格布局。
- 查看行和列编号，以便在放置网格项时参考。
- 如果网格项很多且数字令人困惑，请使用线条和区域名称，并在叠加层上查看这些名称。
- 检查轨道大小。
此外，在元素 > 样式窗格中，借助网格编辑器，您只需点击按钮，即可在网格布局中对齐项及其内容，而无需输入 CSS 规则。
如需获得更多实操学习体验，请按照检查 CSS 网格教程操作。