如何使圖像從容器底部開始？

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; 
}