问题遇到的现象和发生背景
我们要设计一个问卷在手机上面显示（自适应）或者说如何写代码使其在移动端展示
（核心技术或者推荐啥优质视频越简单越好急用）
简单来说有没有解决自适应的方法需要学习的技术或者推荐的视频和链接求指路
入门没多久，但是急！
问题相关代码，请勿粘贴截图
以下为body内代码（一共四张图）
<body>
<div id="background">
<div id="return">
<img src="img/details_btn_return.png" style="width: 30px;height: 40px;
filter: invert(100%);" />
</div>
<div id="tlogo">
<img src="img/homepage_logo.png" width="518px"/>
</div>
<div id="tbanner">
<img src="img/homepage_banner.png" width="700px"/>
</div>
<div id="tbanji">
<img src="img/homepage_btn_banji.png" width="490px"/>
</div>
</div>
</body>
<script src="js/jquery-3.6.0.min.js"></script>
<script>
//页面一进来获取屏幕尺寸
$(document).ready(function(){
$("body").css({"width":$(document).width()+"px","height":$(document).height()+"px"})
})
</script>
以下为css代码
#background{
background-color: #4a81e3;
width: 1080px;
height: 1856px;
border: 0px;
}
#bo{
align-content: center;
}
#return{
position: relative;
top:56px;
left: 79px;
}
#tlogo{
width: 518px;
height: 100px;
margin:0 auto;
position: absolute;
top:200px;
left: 281px;
}
#tbanner{
width: 736px;
height: 606px;
margin: 0 auto;
margin-top: 150px;
position: relative;
top:272px;
}
#tbanji{
width: 490px;
height: 85px;
margin:0 auto;
position: relative;
top :578px;
}
我的解答思路和尝试过的方法
不是很会jQuery写的无用感觉没写完整
我想要达到的结果
集思广益！或者谁能帮我完整一下，谢谢
