App.vue文件
<template>
<div id="app">
<router-view />
</div>
</template>
export default {
name: "APP",
data() {
return {};
},
created() {
this.windowResize();
},
mounted() {},
methods: {
windowResize() {
//屏幕分辨率为1920*1080
const loadFull = () => {
let width = window.innerWidth / 1920;
let height = window.innerHeight / 1080;
document.body.style.cssText = `transform:scale(${width},${height});transform-origin:left top;background-size: 100% 100%;`;
};
loadFull();
window.addEventListener("resize", loadFull);
}
}
};
<style>
html {
width: 100vw;
height: 100vh;
background-size: 100% 100%;
}
body {
/* overflow: hidden; */
width: 1920px;
height: 1080px;
background-size: 100% 100%;
}
#app {
width: 100%;
height: 100%;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
width: 0;
height: 0;
}
</style>