保持纵横比与图像宽度在css中 [英] Keep aspect ratio with image width in css

问题描述

有没有办法使用css修复宽度较小的图像宽高比？也许通过使用jQuery / javascript？

Is there a way to fix the aspect ratio of images given a smaller width using css? Maybe by using jQuery / javascript?

谢谢！

推荐答案

使用纯CSS，你只能设置图像的一个维度， width 或 height 并将另一个设置为 auto ，例如：

With plain CSS, you could set only one dimension of the images, either width or height and set the other as auto, e.g.:

.thumb { 
  width:200px;
  height:auto;
}

图像宽度固定为200px，高度取决于宽高比。

The images will have a fixed 200px width, and the height will depend on the aspect ratio.

这篇关于保持纵横比与图像宽度在css中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！