CSS网格：图像大小相同

我使用网格创建图库

我的图像有不同的

大小

。最简单的方法是使用

固定大小创建
容器
，并使用
溢出：隐藏

但是我会有
宽度：100%
的
列，我会保持比例

有可能吗

这是我的密码：


.container{
宽度：90vw；
保证金：0自动；
}
@介质（最大宽度：500px）{
.电网{
显示：网格；
网格模板列：重复（3，1fr）；
对齐内容：周围的空间；
栅柱间隙：10px；
网格行间距：10px；
}
}
@介质（最小宽度：500px）{
.电网{
显示：网格；
网格模板列：重复（4，1fr）；
对齐内容：周围的空间；
栅柱间隙：15px；
网格行间距：15px；
}
}
@介质（最小宽度：700px）{
.电网{
显示：网格；
网格模板列：重复（6，1fr）；
对齐内容：周围的空间；
栅柱间隙：15px；
网格行间距：15px；
}
}
@介质（最小宽度：900px）{
.电网{
显示：网格；
网格模板列：重复（8，1fr）；
对齐内容：周围的空间；
栅柱间隙：15px；
网格行间距：15px；
}
}
img{
宽度：100%；
高度：自动；
}


这里有
对象匹配的说明
：



您可以根据需要设置
高度
（例如，我设置
150px
）

这里有
对象匹配的说明
：



您可以根据需要设置高度（例如，我设置了150px
FYI：使用对象拟合：填充将失去比例。

您可能需要尝试：
objectfit:cover以保持您在问题中询问的比例

img{
    width: 100%;
    object-fit: cover;
    height: 150px;
}

FYI：使用
对象拟合：填充将失去比例。

您可能需要尝试：
objectfit:cover以保持您在问题中询问的比例

img{
    width: 100%;
    object-fit: cover;
    height: 150px;
}

显示您的代码…查看我的答案并告诉我您是否需要帮助显示您的代码…查看我的答案并告诉我您是否需要帮助