按照CSS的比例调整图像大小，是可能吗？ [英] resize an image in proportion with CSS, is it possible?

问题描述

有什么方法可以使用CSS调整保持其比例的图片大小？

容器有固定的宽度和高度

 < div class =container> 
< img class =theimagesrc =something/> 
< / div> 
  

，我要求的原因是因为布局可以改变（从列表到图标通过类）和图像需要按比例调整大小（约减少40％）。

我知道如何使用JavaScript，以及如何通过CSS调整大小， '

解决方案

pre> .theimage {
width：100％;
height：auto;
}


或

  .theimage {
 width：auto; 
 height：100％; 
} 
  

取决于您想要给予比例偏好... :) :)

这一切。

Is there a way to resize images retaining their proportions with CSS?

The container has a fixed width and height

<div class="container">
   <img class="theimage" src="something" />
</div>

and the reason I'm asking is because the layout can change (from list to icons via a class) and the images need to be resized (about 40% less) in proportion.

I know how to do it with JavaScript and also how to resize via CSS, but don't really believe it can be done in proportion with CSS, unless there is some clever way.

解决方案

.theimage{
    width:100%;
    height:auto;
}

or

.theimage{
    width:auto;
    height:100%;
}

Depending on how you wanna give the scale preference... :) :)

Thats all.

这篇关于按照CSS的比例调整图像大小，是可能吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！