CSS：沿div底部对齐图像

Question

我正在尝试将 3 个图像沿其底部边缘对齐，以使其看起来干净且均匀。我在一个 Div 中有 3 个图像，而 Div 在一个部分内。该部分是相对定位的，而 Div 是绝对定位的，底部：0，因此图像保持在页面底部的页脚上方。

如何让图像的底部边缘像在一条直线上一样对齐？

注意*：忽略内联样式，图像不成比例，所以我不得不内联样式来修复它们。

HMTL：

<section>
    <div class="logo-footer">
        <img style="width: 100px; margin-right: 40px" src="google.com/images/srpr/logo11w.png"/>
        <img style="width: 500px; height: 75px; " src="google.com/images/srpr/logo11w.png"/>
        <img style="width: 250px" src="google.com/images/srpr/logo11w.png"/>
    </div>
</section>

CSS：

.logo-footer {
display: -webkit-flex;
display: flex;

-webkit-flex-direction: row;
flex-direction: row;

-webkit-justify-content: center;
justify-content: center;

-webkit-align-self: center;
align-self: center;

height: 115px;

position: absolute;
bottom: 10px;
}

.logo-footer img{
margin: 0 50px;
}

Answer 1

设置部分 position:relative 和 div position:absolute，颠倒你做到了。然后设置 div bottom:0px 或任何你需要的。