nuxt3 vue 让PC网站在手机上按比例缩小适应屏幕

让PC网站在刚进入网页的时候,在手机上自动按比例缩小适应屏幕。
直接代码:

nuxt3:

nuxt.config.js

head: {
    
    
	meta: [
        {
    
    
          name: "viewport",
          content: "width=device-width, initial-scale=0, user-scalable=yes,shrink-to-fit=no",
        },
        {
    
    
          charset: "utf-8",
        },
      ],
  },

vue

index.html

<meta name="viewport" content="width=device-width, initial-scale=0, user-scalable=yes,shrink-to-fit=no">

JS实现

onMounted(() => {
    
    
  if (typeof window !== "undefined") {
    
    
    const percentageOn1 = (window.screen.width / 1920) * 100;
    document.body.style.zoom = percentageOn1 + "%";
   }
});

猜你喜欢

转载自blog.csdn.net/weixin_55042716/article/details/130059140