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

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