Question

我有一个动态/响应div图片。并希望根据DIV高度/宽度使图像高度或宽度为100％。我不想拉伸图像。宽度或高度应该是100％而不是两者。

的示例

Answer 1

为此图片提供CSS

.css{ max-width:100%;

    max-height:100%}

此处图像采用父div的宽度。这里的图像不会伸展，图像会得到比例的高度和重量

示例：http://jsfiddle.net/CLrUS/1/

Answer 2

增加刚度：

.class img{
    height: 100%;
    width: auto;
}

这个只是宽度：

.class img{
    height: auto;
    width: 100%;
}

Answer 3

试试这个：

<img src="#your image#" onload="imgFitParent($(this));" style="width:inherit; height:inherit;">

<script type="text/javascript">
function imgFitParent(imgElemt)
{
    if(imgElemt.parent().width() > imgElemt.parent().height()){ 
        imgElemt.height("100%"); 
        imgElemt.width('auto'); 
    }else{ 
        imgElemt.width("100%"); 
        imgElemt.height('auto'); 
    }
}

</script>

像这样： JSFIDDLE

Answer 4

使用min-width和max-width

img{
    min-width: 100%;
    max-width: 100%;
}

尝试调整面板大小

http://jsfiddle.net/e3yPT/

根据父div宽度/高度调整图像的100％高度或宽度

4 个答案: