<style scoped>.loginBox{padding: 0;width: 100%;min-height: 100vh;background: #c3c4c5;}</style> 原因body自带margin属性 解决方法 在index.html中添加 margin: 0;padding: 0;属性

height: 100%; 与 height: 100vh; 在 CSS 中有着不同的含义和应用场景。 height: 100%; 表示元素的高度将与其父元素的高度相同。但是，要使 height: 100%; 生效，父元素必须具有明确定义的高度，例如固定高度值或相对定位。如果父元素的高度未被明确定义，那么 height: 100%; 将不会生效。 height: 100vh; 表示元素的高度

在CSS中，100vh 表示视口（viewport）的高度。视口是指浏览器窗口中可见内容的区域，即用户能够看到的网页部分。 100vh 表示视口高度的百分比，具体数值取决于当前浏览器窗口的高度。例如，如果浏览器窗口的高度为800像素，那么 100vh 将等于800像素。 需要注意的是，100vh 不包括浏览器的工具栏、地址栏或其他浏览器界面的高度。它仅表示可见内容的高度。  类的高度设置为