如何使图像从容器底部开始？

Question

我在overflow: hidden;的短容器内有一个高大的图像。图像的底部被切断。我如何让顶部被切断而不是底部？

Answer 1

给所述容器下面的CSS：

position:relative; 

和图像下面的CSS：

position:absolute; 
bottom:0px; 

P.S.
很不错（和明确的）插图BTW

Answer 2

如果你的形象是容器的只是background-image，做到这一点的方法：

#container { 
    background: url(your-image.jpg) no-repeat bottom left; 
} 

否则，img元素位置在容器的底部，像@Joseph建议：

#container { 
    position:relative; 
} 

#container img { 
    position: absolute; 
    bottom: 0px; 
} 

Answer 3

如果容器有一个300像素的高度，例如，这个工程：

.container { 
    overflow: hidden; 
    height: 300px; 
    position: relative; 
} 

.image { 
    position: absolute; 
    bottom: 0; 
}