CSS网格自定义布局创建

在花了数小时的时间试图配置这个东西之后，我无法得到关于制作这些“自定义”网格布局的正确答案。我自己试过，但都没有接近

我正在尝试制作图片中提供的布局。如果有人能帮助我，我将非常感激

---

以下是一些让您开始学习的内容：

body{margin:0}
.电网{
显示：网格；
网格模板：重复（3，1fr）/重复（3，1fr）；
栅隙：10px；
}
.盒子{
填充：20px；
背景：灰色；
}
.首先{
网格行：跨度2；
}
.第四{
网格面积：跨度2/跨度2；
}

第一
第二
第三
第四
第五

你的HTML和CSS的最佳尝试在哪里？出了什么问题？怎么会出错？请同时阅读“”和“”指南；我们不是来为您编写代码的：我们是来帮助您的。