Javascript 如何在不同的设备上显示固定数量的图像

我有一排图像，我希望它们在lg设备上显示为4个图像，在sm和md设备上显示为2个图像，但我不知道如何使用网格来实现这一点。这是我的引导代码。你可以在技能部分看到效果。当你将屏幕调整为sm时，图像会占据整个屏幕的宽度

如何使它们只占宽度的50%，以便在一行中显示两个图像

img{
高度：200px；
}

网格1
网格2
网格3
网格4

将网格类从

col-md-3

替换为

col-md-6

我猜您没有在图像上设置任何css以防止它们溢出列。请提供一个复制的问题，我没有为此代码设置任何css这是一个最小的引导代码，甚至是完整的，我已经在发布前验证过，如果你想测试它，只需在head标签中添加引导cdn。