가로 세로 비율을 유지하도록 이미지 크기 조정

Question

브라우저 창에서 이미지 크기를 최대한 확대하고 싶지만 가로 세로 비율은 결코 잃지 않아야합니다. 브라우저 크기가 조정되면 이미지도 함께 표시됩니다. 모든 이미지는 항상 표시되어야합니다.

나는이 스크립트를 지금 사용하지만 결과는 내가 원하는 것이 아니다. 누구든지이 문제를 해결하는 방법을 말해 줄 수있어 이미지가 가로 세로 비율을 잃지 않고 가능한 넓고 높을 것입니다. 나는 어떤 종류의 최대 너비와 최대 높이가 사용되어야한다고 생각하니?

<script> 
var W = $(window).width(), 
    H = $(window).height(); 

$('img').height(H).width(W); 



function imgsize() { 
    var W = $(window).width(), 
     H = $(window).height(); 

    $('img').height(H).width(W); 
} 
$(window).bind('resize', function() { imgsize(); }); 

</script> 

Answer 1

this answer을 살펴보십시오. 화면 크기에 maxWidth 및 maxHeight을 설정하십시오.

max-width: 100%; 
max-height: 100%; 

:

또한 CSS를 사용할 수 있습니다