COMO FAZER MEU SITE SE ADAPTAR A UM MONITOR DE QUALQUER RESOLUÇÃO?

Com HTML e CSS pra se fazer esse tipo de ajuste só usando o: "@media" no CSS

Tem um conceito aplicado na implementação web chamado : MIBILE FIRST; ou seja, o design para aparelhos mobile deve ser projetado antes que o desing para desktop;
Basicamente, seria assim ... imagina um documento CSS que estiliza um formulário HTML que vc quer ajustar ele para diversas telas ( do celular com menor display a um grande monitor ), como vc faria ?
Primeiro vc começaria a estilizar focando os displays para mobile depois vc progrediria pra displays desk, mais ou menos assim :

ARQUIVO CSS :

/* TUDO QUE ESTIVER AQUI ABAIXO, ANTES DO COMANDO "@MEDIA", SERÁ O PADRÃO DO SITE */

form{
width : 300px
height : 400px
}

input{
width : 150px
height: 30px
}

button{
width : 80px
height: 20px
}

/* AGORA ABAIXO DESSE COMANDO "@MEDIA", ASSIM QUE SUA TELA FOR MAIOR QUE 600PX O FORMULÁRIO SE AJUSTARÁ AOS NOVOS VALORES QUE VC COLOCAR NO FORM*/


@media(min-width: 600px) {

form{
width : 500px
height : 700px
}

input{
width : 200px
height: 36px
}

button{
width : 120px
height: 36px
}


}


/* ASSIM POR DIANTE ... AGORA SE VC QUISER CONFIGURAR O SITE PARA UMA TELA QUE SEJA MAIOR QUE 1200 PX, OU QUALQUER OUTRO VALOR, BASTA VOCÊ TROCAR O VALOR DO " MIN-WIDTH" DENTRO DO PRÓXIMO @MÉDIA PARA O VALOR DESEJADO */

! sempre que o display for maior que 1200px os objetos sofrerão as alterações setadas abaixo !

@media(min-width: 1200px) {


form{
width : 600px
height : 800px
}

input{
width : 240px
height: 36px
}

button{
width : 160px
height: 36px
}

}

Dá uma olhadinha no comando "@media" do css pois há mais coisas que vc pode fazer com ele para o propósito de ajuste de tela.
Tem um artigo muito bom, da DEVMedia, que explica várias funcionalidades que pode te ajudar ... segue o link :
https://www.devmedia.com.br/utilizando-css-media-queries/27085