裁剪图像的中心部分以适合固定高度的容器

Question

我需要居中裁剪图像，而不会拉伸图像以适合容器。我在下面做了。当图像高度较大时，它会裁剪底部高度以适应容器，但如果高度较低，则不适合容器。我怎样才能将图像裁剪出来并适合给予大小的容器？

<div class="imagecontainer"> 
     <img class="full-width" src="../images/123.jpg" />            </div> 

css: 
.imagecontainer { 
background: #dbdbdb; 
max-height: 166px; 
min-height: 166px; 
text-align: center; 
overflow: hidden; 
} 

.full-width { 
width: 100%; 
} 

Answer 1

试试这个<img class="full-width" src="../images/123.jpg" height=166 width=100%/>

Answer 2

DEMO

HTML

<div class="imagecontainer"> 
    <div class="full-width"></div> 
</div> 

CSS

.imagecontainer { 
    background: #dbdbdb; 
    text-align: center; 
    overflow: hidden; 
} 
.full-width { 
    max-height: 166px; 
    min-height: 166px; 
    background: url("http://www.codess.net/wp-content/uploads/hello_world.png") no-repeat center center; 
} 

保留<img src="">的事情，不透明度招

Demo

.imagecontainer { 
    text-align:center; 
    width: 100%; 
    height: 166px; 
    background-image: url('http://www.codess.net/wp-content/uploads/hello_world.png'); 
    background-position: center center; 
    background-repeat: no-repeat; 
    overflow: hidden; 
} 
.imagecontainer .full-width { 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 
    filter: alpha(opacity=0); 
    opacity: 0; 
}