Html 如何使用bootstrap使图像显示在台式机和平板电脑上，而不是手机上？

我正在做我的一个小项目。 这是一个预订旅游的网站。 我仍处于早期阶段，但它看起来是这样的：

如您所见，每个巡演都有自己的“div”，分为3列：预览图像、简短描述和预订巡演的按钮。 我可以很容易地添加图像作为背景，但是如果我将页面缩小到手机的大小，则第一个div上方会出现第二个div，其中包含图像，如下所示：

我不知道为什么会这样。你们有没有人知道如何让图像的div在手机上消失，或者如何解决这个问题？ 下面提供了HTML和CSS代码，我正在使用bootstrap

PS：忽略按钮周围的空白

正文{
边际：0px；
填充：0px；
}
琼伯伦先生{
边界半径：0px；
边缘底部：0px；
}
.选项{
边缘顶部：30px；
}
.旅游{
填充：0px；
边缘底部：25px；
边界半径：5px；
边框：1px纯灰；
最大宽度：100%；
高度：20vh；
}
.预览img{
身高：100%；
}
.短描述{
填充顶部：2vh；
身高：100%；
背景色：红色；
}
.更多信息{
身高：100%；
填充：0px；
}
.infobtn{
身高：100%；
宽度：100%；
}

家
标题
描述

第1栏
Lorem Ipsum door Sit Amet
更多

将

隐藏的xs

类添加到您的

预览img

div