コンテンツは一定の再サイズの後に画面に収まる

Question

1024幅以下私はページの本文をスクロールバーのないユーザーの画面に合わせたいと思います。基本的には、1024幅以下のスクリーンブラウザ（スクロールバーなし）に合うように全身を拡大する必要があります。

function resizeWindow() { 
    $(window).off('scroll'); 

    windowWidth = $(window).width(); 
    console.log(windowWidth); 
    if (windowWidth > 1024) 
    { 
     console.log(">1024"); 
    }else if (windowWidth <= 1024) 
    { 
     $('body').css('height', '100vh'); 
     $('body').css('width', '100vw') 
    } 
} 

$(window).resize(resizeWindow); 

CSS：

body, html { 
height: 100%; 
width: 100%; 
} 

Answer 1

@mediaクエリを使用し 私はこのような何かを試してみました。デスクトップをターゲットとする方法、タブレット：通常のビューポートメタの設定

は

@media screen and (max-width: 1024px) { 
    body, html { 
    height: 100vh; 
    width: 100vw; 
    } 
}