我正在重新创建一个苹果登录页面。但是，一个问题是，表单输入没有响应。调整窗口大小时，背景会更改为适合窗口大小，但登录表单却不会。这是我的代码，包括html和css。
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
header {
background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(hero.jpeg);
background-size: cover;
background-position: center;
height: 100vh;
}
.login {
position: absolute; /* Turns the the text box to absolute from static (allows free control of placement) */
width: 1140px;
top: 30%;
left: 500;
height: auto;
font-size: 23pt;
}
#space-password {
padding-top: 20px;
}
html {
color: whitesmoke;
font-weight: 100;
font-family: 'Lato', 'Arial', sans-serif;
text-rendering: optimizeLegibility;
}
input{
border-radius: 50px;
color: aliceblue;
background-color: #34495e;
}
这是HTML：
<!DOCTYPE>
<html lan="en">
<head>
<link rel="stylesheet" type="text/css" href="vendors/css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet">
<title>Welcome-Sign in</title>
</head>
<body>
<header>
<form class="login">
<p>Apple ID:</p><br>
<input type="text" name="Apple ID"><br>
<p id="space-password">Password:</p><br>
<input type="password" name="Password">
</form>
</header>
</body>
</html>
编辑：你们所有人的解决方案现在都在起作用，输入框的宽度会填满整个屏幕！反正要停止吗？
最佳答案
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
header {
background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(hero.jpeg);
background-size: cover;
background-position: center;
height: 100vh;
}
.login {
width:50%;
margin:0 auto;
height: auto;
font-size: 23pt;
}
.login p{ text-align:left}
#space-password {
padding-top: 20px;
}
html {
color: whitesmoke;
font-weight: 100;
font-family: 'Lato', 'Arial', sans-serif;
text-rendering: optimizeLegibility;
}
input{
border-radius: 50px;
color: aliceblue;
background-color: #34495e;
width:80%;
}<!DOCTYPE>
<html lan="en">
<head>
<link rel="stylesheet" type="text/css" href="vendors/css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Lato:300,400" rel="stylesheet">
<title>Welcome-Sign in</title>
</head>
<body>
<header>
<form class="login">
<p>Apple ID:</p><br>
<input type="text" name="Apple ID"><br>
<p id="space-password">Password:</p><br>
<input type="password" name="Password">
</form>
</header>
</body>
</html>