vue页面如何自适应屏幕尺寸

要使Vue页面自适应屏幕尺寸，可以使用CSS的媒体查询（Media Query）功能。在Vue组件中，可以使用`<style>`标签来定义样式，如下所示：

<template>
  <div class="container">
    <!-- 页面内容 -->
  </div>
</template>

<style>
/* 宽度小于等于768px时的样式 */
@media screen and (max-width: 768px) {
  .container {
    width: 100%;
  }
}

/* 宽度大于768px时的样式 */
@media screen and (min-width: 769px) {
  .container {
    width: 768px;
    margin: 0 auto;
  }
}
</style>

以上代码中，使用了两个媒体查询来设置不同屏幕尺寸下`.container`容器的宽度和样式。在宽度小于等于768px时，容器宽度为100%，在宽度大于768px时，容器宽度为768px并居中显示。

除了使用CSS媒体查询外，还可以使用Vue UI库，如Element UI、Vuetify等，它们都提供了自适应屏幕尺寸的布局组件和样式，可以更方便地实现页面的自适应。