重新調整大小而不失真的圖像

Question

所有圖像都有一個共同點;它們都是300或600像素寬。但高度從300-900像素不等。現在我需要一小組圖像，這些圖像將用於爲用戶提供其他圖像。這些只會在100x200像素左右（可能會改變）。我以前的嘗試已經使圖像縮小到100x200縱橫比。我需要它重疊，但多餘的東西是隱藏的。

Answer 1

嘗試這樣的事情http://dabblet.com/gist/2769112

你需要的CSS簡直是

.img-container { 
    width: 200px; /* whatever set width */ 
    height: 100px; 
    display: inline-block; /* or you could float them */ 
    overflow: hidden; 
} 
.img-container img { 
    width: 100%; 
} 

Answer 2

將圖像放入具有指定高度和寬度的包裹元素（例如DIV）中，並使用overflow:hidden。