HTML CSS如何设置100％的高度，扩展时的宽度为100％，但当宽度变窄时，它不显示全宽

Question

我不确定如何实现我想做的事情。很难完全描述我的意思，但我有一个例子。

情况 当屏幕水平展开时，图像被设置为屏幕宽度的100％，但是当图像缩小时，它不会完全显示图像，而是保持高度100％。

我在下面附上了一个例子，这正是我的想法。

http://www.therentscene.com/

     <script>
   var container=window;
         var image=document.getElementById("backimage")
         if (container.height() > container.width()) {
    image.css({height: container.height(), width: ''});
} else {
    image.css({height: '', width: container.width()});
}



  </script>

Answer 1

使用js / jQuery并找到max(container.h, container.w)并将该值应用于图像本身

if (container.height() > container.width()) {
    image.css({height: container.height(), width: ''});
} else {
    image.css({height: '', width: container.width()});
}