获取图像垂直调整大小 [英] Get images to resize vertically

问题描述

我设法获得图像来尊重容器的最大宽度，但是当我尝试做同样的max-height图像只是在底部切碎。出了什么问题？

http://jsfiddle.net/ HsPtp / 7 /

解决方案

您需要将img样式height和width设置为100％

  #post_holder img {
 width：100％; 
 height：100％; 
} 
  

然后通过调整包装div的大小来控制大小。 / p>

  #post_holder {
 border：1px solid red; 
 width：50px; 
 height：300px; 
} 
  

我给了包装的div一个红色边框只是为了看到它的大小。
我在jslint.com中创建了一个示例 http://jsfiddle.net/CQyHJ/

I managed to get images to respect the max-width of the container but when I try to do the same with max-height the images just get chopped off at the bottom. What's wrong?

http://jsfiddle.net/HsPtp/7/

解决方案

You need to set the img styles "height" and "width" to 100%

#post_holder img{
   width:100%; 
   height:100%;  
}

Then control the size of it by adjusting the size of the wrapping div.

#post_holder{
  border:1px solid red; 
  width:50px;
  height:300px; 
}

I gave the wrapping div a red border just to see the size of it. I created an example in jslint.com http://jsfiddle.net/CQyHJ/

这篇关于获取图像垂直调整大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！