Css 如何让第一个子盒子出现在中间

这是我的建议

HTML

我只想让图像在中间看起来更大。左边是两个图像，右边是两个图像，中间是一个大的图像。我尝试将n:child更改为2、3、4甚至5。它不断添加列和行，并不是我想要的。希望有人能帮助我。如果这是您想要的，谢谢

因为你想要中间的图像，它将是第三个图像，使用类型选择器的第n个来设置宽度

.tiles-slider li:nth-of-type(3) {
   width: 50%;
}

要制作左边的两个图像，中间一个，后面两个，我能想到的最简单的方法就是使用FlexBox。将容器设置为一定高度，并使其垂直缠绕

.tiles-slider {
    padding: 0;
    list-style-type: none;
    overflow: auto;
    margin-bottom: 0;
    background: #000;

    display: flex;
    flex-direction: column;
    height: 300px;
    flex-wrap: wrap;
    justify-content: center;
}

.tiles-slider li:nth-of-type(3) {
   width: 50%;
}

.tiles-slider {
    padding: 0;
    list-style-type: none;
    overflow: auto;
    margin-bottom: 0;
    background: #000;

    display: flex;
    flex-direction: column;
    height: 300px;
    flex-wrap: wrap;
    justify-content: center;
}