css – 如何将图像放置在div的底部?

我想要一个html图像与div标签的底部齐平。我似乎找不到一个办法来完成这个。

这是我的HTML:

<div class="span8">
  <img src="/img/play-shot1.jpg" class="text-center shadow">
</div>

问题是div被嵌套在其他具有填充或边距的div中。

解决方法

向包装div标签添加相对定位,然后将图像绝对定位在其中:

CSS:

.div-wrapper {
    position: relative;
    height: 300px;
    width: 300px;
}

.div-wrapper img {
    position: absolute;
    left: 0;
    bottom: 0;
}

HTML:

<div class="div-wrapper">
    <img src="blah.png"/>
</div>

现在图像位于div的底部。

相关文章

Css常用的排序方式权重分配 排序方式: 1、按类型&#160;...
原文:https://www.cnblogs.com/wenruo/p/9732704.html 先上...
css属性:word-wrap:break-word; 与 word-break:break-all 的...
https://destiny001.gitee.io/color/
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML...
css之background的cover和contain的缩放背景图 对于这两个属...