如何使用 Col-MD-4 类制作一行，我可以在其中放置尺寸完全相同的图像

Question

我必须在我的网页中制作两行才能每行显示 4 张图像。 但是当我将图像放入代码中时，即使我将它们调整为相同尺寸的大小，它们也会以不同的尺寸显示。 请帮忙。 该行的代码如下：

    <div class="col-md-3">
                   <div class="container">
                    <img src="images/resized/photo.jpg" 
                       alt="Avatar">
                        <div class="overlay">
                       <div class="text">Romance</div>
                     </div>
                    </div>
                </div>

覆盖该行的类如下所示：

    .container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 20px;
    padding-bottom: 10px;
}

Answer 1

.container是 bootstrap 使用的一个类，你在 CSS 中调用它的方式会搞砸整个 bootstrap 网格系统。

将容器类重命名为其他名称，例如 mycontainer 应该可以解决问题