Jquery 如何在引导中居中显示这些图像？

嘿，你在吗

我正试图将这些图像居中。我尝试了所有我在引导中发现的关于垂直居中的方法

在这里您可以看到我的源代码。如果我删除CSS样式表中“div”和“html”上的行（高度：100%）；图像似乎居中，但整个页面堆叠在一起。如何将这些图像居中，并保持“全屏”布局

html，
身体{
身高：100%；
/*如果我删除这一行，它会工作，但不再是全屏*/
宽度：100%；
保证金：0；
}
div{
身高：100%；
/*如果我删除这一行，它会工作，但不再是全屏*/
/*宽度：100%*/
保证金：0；
}
.标题{
身高：10%！重要；
}
.内容{
身高：80%！重要；
}
.页脚{
身高：10%！重要；
}

.col-lg-2
.col-lg-8
.col-lg-2
.col-lg-1
.col-lg-10
.col-lg-1
.col-lg-2
.col-lg-8
.col-lg-2

图1
图2
图3
嘿，你看到这样的东西了吗？？这正是我为你提出的问题而来的

了解Bootstrap的网格系统是如何工作的很重要。您需要清除一个断点，在该断点之后，内容可以将一个断点堆叠到另一个断点之下。下面是对代码的修改，可以帮助您更好地理解：

引导类（col-md-4、lg-8等）将自动帮助您调整大小，使用以下CSS规则将图像居中：

CSS

这将确保您的图像占据div的全部宽度。检查小提琴的完整代码

---

以下是更新后的小提琴。

将

d-flex-justify资源中心

添加到具有3个图像的容器中

html，
身体{
身高：100%；
宽度：100%；
/*如果我删除这一行，它会工作，但不再是全屏*/
保证金：0；
}
div{
身高：100%；
/*宽度：100%*/
保证金：0；
}
.标题{
身高：10%！重要；
}
.内容{
身高：80%！重要；
}
.页脚{
身高：10%！重要；
}

.col-lg-2
.col-lg-8
.col-lg-2
.col-lg-1
.col-lg-10
.col-lg-1
.col-lg-2
.col-lg-8
.col-lg-2

在附加的小提琴中，图像不会显示附加的JSFIDLE中的UPPLESE upload图像，以便ii回答您的愿望问题。图像现在添加到小提琴中，其外观也在附加的帖子中。谢谢你的帮助@TineWittler添加了一个答案，请检查它是否适用于您。我不同意属性宽度：100%。如果容器比图像本身大怎么办？

<div class="container-fluid" style=background-color:lavender>
  <div class="row text-center">
    <div class="col">
      image1
    </div>
    <div class="col">
    image2
    </div>
    <div class="col">
    image3
    </div>
  </div>
</div>

Hey are u seeing something like this ?? this is what i came appropriate for your query

img{
 height: auto;
 width: 100%;
 }