在做vue和qt的开发，qt上有三个窗口调用同一个网页，怎么实现不同的窗口大小调用同一个网页，网页能自适应大小，我网上的已经都试过了，比如media screen还有设置宽度都不起作用，前后端能试的我都试了
在网页中，可以使用CSS的media query来根据不同设备的尺寸设置不同的样式，从而实现自适应大小
/* 默认样式 */
.my-webpage {
width: 1000px;
height: 800px;
}
/* 当屏幕宽度小于800px时 */
@media screen and (max-width: 800px) {
.my-webpage {
width: 100%;
height: auto;
}
}
/* 当屏幕宽度小于600px时 */
@media screen and (max-width: 600px) {
.my-webpage {
width: 100%;
height: auto;
font-size: 14px;
}
}
这段CSS代码设置了一个默认的宽度和高度，并定义了两个@media query，分别针对屏幕宽度小于800px和600px的情况，分别设置了不同的宽度、高度和字体大小。
要实现不同大小的窗口调用同一个网页并且网页能自适应大小，你可以使用CSS3的弹性盒模型（Flexbox）和网格布局（Grid）。
首先，为了让网页自适应大小，你可以使用Viewport meta标签来设置网页的宽度，这样网页就能够根据窗口大小进行缩放：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
接着，你可以使用Flexbox和Grid来布局页面，并使它们自适应大小。例如，使用Flexbox布局可以将子元素放置在父容器中并使用flex-grow属性来使它们自适应大小：
.container {
display: flex;
flex-direction: row;
}
.child {
flex-grow: 1;
}
或者使用Grid布局，可以使用grid-template-columns属性来设置子元素的宽度，并使用grid-auto-rows属性来设置子元素的高度：
.container {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-auto-rows: 100px;
}
最后，你可以根据不同的窗口大小设置不同的CSS样式。使用媒体查询（Media Query）可以在不同的屏幕大小下应用不同的样式：
@media screen and (max-width: 600px) {
/* 在屏幕宽度小于 600px 时应用这些样式 */
.container {
display: flex;
flex-direction: column;
}
}
希望这些方法能够帮助你实现不同大小的窗口调用同一个网页并且网页能自适应大小。
有用望采纳~