大屏页面布局

首先固定屏幕尺寸,不允许缩放。

设计稿按照

vue中index.html页面,添加js 使屏幕比例设置为固定 1920px*1080px





    
    
    
    Vite App
    



    

其次css设置固定的宽高

base.css

html {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
html,
body {
  padding: 0;
  margin: 0;
  border: 0;
}
body {
  min-width: 1920px !important;
  min-height: 1080px !important;
  max-width: 1920px !important;
  max-height: 1080px !important;
}
#app {
  background: #000c15;
}

你可能感兴趣的:(CSS,html,前端)