html - 不同的图像尺寸不对称地向下移动 div

Question

我正在进行以下操作:

  <div class="row">
          <div class="col-md-4 content-column">
            <img class="btn-center btn-desktop" src="images/buttons/btn-desktop.svg" alt="desktop button">
            <h2 class="btn-desktop-headline">Desktop Applikationen</h2>
          </div>

          <div class="col-md-4 content-column">
            <img class="btn-center btn-webdesign" src="images/buttons/btn-webdesign.svg" alt="webdesign button">
            <h2 class="btn-webdesign-headline">Webdesign</h2>
          </div>

          <div class="col-md-4 content-column">
            <img class="btn-center btn-ios" src="images/buttons/btn-ios.svg" alt="ios Logo button">
            <h2 class="btn-ios-headline">iOS</h2>
          </div>
        </div>

现在，根据图像大小，标题是否进一步向下移动。我该如何解决这个问题？

Answer 1

处理此问题的最佳方法是放置具有全宽和 css 指定高度的 div。当您从服务器端获取图像时，您应该将它们绑定(bind)到样式属性中。

这样做的好处是您可以在不弄乱宽高比的情况下拉伸(stretch)图像并将其定位到 div 的中心。