将纵横比与图像宽度保持在css中

有没有办法使用CSS来确定宽度较小的图像的宽高比？ 也许通过使用jQuery / javascript？

谢谢！

Answer 1

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

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

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

Answer 2

这是jQuery解决方案;）

 function fixImage(elm) { elm = $(elm); var x = elm[0]; var allowedHeight = 80; var allowedWidth = 80; if (width > height) { elm.css('width', allowedWidth + 'px'); elm.css('height', 'auto'); } else { elm.css('height', allowedHeight + 'px'); elm.css('width', 'auto'); } }