background color about vue component

component/approve/Login.vue

@@ -9,15 +9,17 @@ export default {
 </script>
 
 <template class="login">
+<div class="login">
   <h4 style="color:orange;">登录页面</h4>
   <label>用户名</label><input type="text" placeholder="请输入用户名"/><br/>
   <label>密码</label><input type="password" placeholder="请输入密码"/><br/>
   <button>登录</button>
+</div>
 </template>
 <style scoped>
 .login{
-  width:100vw;
-  height:100vh;
+  width:80%;
+  height:50%;
   display: flex;
   justify-content: center;
   align-items: center;

component/approve/Register.vue

@@ -24,8 +24,8 @@ export default {
 </script>
 <style scoped>
 .register{
-  width:80vw;
-  height:50vh;
+  width:80%;
+  height:50%;
   display: flex;
   justify-content: center;
   /* align-items: center; */