Question

我有一个动态页面，加载的图像可能比div大或小于div。 div的宽度为100％，高度为105px。

我需要图像一直填满整个div。如果图像较大，我需要它保持其纵横比，只显示图像的中心部分。我怎么能这样做？

<div class="image-container info-container-area " style="">
    <div class="info-area">
        <div class="image-wrapper" style="height: 105px;">
            <img src="image.jpg" >
        </div>
    </div>
</div>

Answer 1

尝试为width:inherit; height:inherit;代码

提供img

Answer 2

设置大多数外部Div样式CSS如下。似乎是您的外部div class class="info-area"。

 display: table-cell;vertical-align: middle;

Answer 3

我不知道我的例子是否对你有所帮助...... 你可以尝试我的例子

[http://jsfiddle.net/Ouali/YT85P/3/] [1]

中心图像垂直在较小的div内

3 个答案: