用grid布局将5个li标签实现上面三个，下面2个在第二行居中

要使用CSS Grid布局将5个`<li>`标签分为两行，上排显示3个，下排显示2个并垂直居中对齐，你可以这样做：

首先，在HTML结构中创建5个列表项：

<ul class="grid-container">
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
  <li>列表项4</li>
  <li>列表项5</li>
</ul>

然后，在CSS中添加样式规则：

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); /* 自适应列宽 */
  gap: 10px; /* 列间距 */
  padding: 10px; /* 内边距增加一点空间 */
  box-sizing: border-box; /* 包含边框和内边距在元素尺寸计算中 */
}

/* 上三行 */
li:nth-child(-n+3) {
  grid-row: 1 / span 3; /* 行从第1行开始，占据3行 */
}

/* 下二行，并设置垂直居中 */
li:nth-child(3n) {
  grid-row: 2; /* 行定位于第2行 */
  align-self: center; /* 对齐到当前列的中心 */
}

这段代码会根据内容自动调整列宽，保证上面3个`<li>`在第一行，而下面的2个居中对齐在第二行。