Html 是否可以使用flexbox和css网格制作此布局？

我正在尝试创建一个布局，如

在html和css中，以及下面，您将找到我最终使用的代码

在代码中，我使用的是引导和他们的网格系统，我想知道是否可以使用flexbox和css网格重新创建布局？感谢你的帮助和提示

下面是我想出的代码

返回
我看着



哈利·波特与致命圣器

2020

你哪天看的

标签按Tab键完成，按Enter键创建

评级

五星

我很快编写了这个，我想它会对您有所帮助。你所要做的就是把每个

div

一个接一个地添加CSS，以获得更好的视觉效果

.container{
显示：网格；
网格模板列：重复（4，1fr）；
间隙：10px；
网格自动行：最小内容；
}
.一{
网格柱：1；
网格行：1；
边框：1px纯红；
}
.二{
网格柱：2/5；
网格行：1；
边框：1px纯红；
}
.三{
网格柱：1；
网格行：2/7；
边框：1px纯红；
}
.4{
网格柱：2/5；
网格行：2；
边框：1px纯红；
}
.5{
网格柱：2/5；
网格行：3；
边框：1px纯红；
}
.6{
网格柱：2/5；
网格行：4；
边框：1px纯红；
}
.7{
网格柱：2/4；
网格行：5；
边框：1px纯红；
}
.身高{
网格柱：4/5；
网格行：5；
边框：1px纯红；
}

返回
我看着



哈利·波特与致命圣器

2020

你哪天看的


标签按Tab键完成，按Enter键创建

评级

五星

您好，您不需要引导，请阅读本页，我也会尝试一下。