0

我在我的 VueJS 2 站点上使用Vue-material，它在我的笔记本电脑上看起来与预期的一样。当我缩小屏幕时，它会做出相应的响应。但是，当我模拟智能手机或在智能手机上打开网站时，它看起来就像是计算机布局的“缩小”版本。

我可能在这里遗漏了一些基本的东西，但我不确定它是什么。

缩小浏览器窗口中的站点： 在此处输入图像描述

智能手机上的网站： 在此处输入图像描述

4

2 回答 2

0 
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

在您网站的 Html 中添加这两行，因为它缺少元视口标记。我希望它会帮助你。

于 2019-12-26T13:34:46.570 回答
0

将此元添加到您的index.html

<meta name="viewport" content="width=device-width,initial-scale=1.0">

示例 index.html：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>win-vue</title>
  </head>
  <body>
    <div id="app"></div>
    <script src="/dist/build.js"></script>
  </body>
</html>
于 2021-12-24T20:39:30.770 回答