item1 { grid-area: 1/1/2/4; } 这里使用了你之前学习的网格线编号来定义网格项的区域。 上例中数字代表这些值： grid-area: horizontal line to start at / vertical line to start at / horizontal line to end at / vertical line to end at; 因此，示例中的网格项将占用第 1 条水平网格线（起始）和第 2 条水平网格线（终止）之间的行，及第 1 条垂直网格线（起始）和第 4 条垂直网格线（终止）之间的列。

You use grid-area, so the place for the side nav is allocated at start. If you hide (or even delete) the side nav, that won't change anything about this. You have to do a little trick: Set the width for the first column to 0 and change the grid-gap because otherwise you will have a (not needed) gap at the left.