代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
body{
font-family: Roboto;
background-color: #e76f51;
display: flex;
justify-content: center;
align-items: center;
}
.login{
background-color: #0b123b;
width: 400px;
color: #f8f9fa;
padding: 40px;
box-shadow: 10px 10px 25px #00000080;
text-align: center;
}
.login input{
display: block;
margin: 20px auto;
text-align: center;
background: none;
padding: 12px;
font-size: 15px;
border-radius: 22px;
outline: none;
color: #f8f9fa;
}
.login input[type="text"],.login input[type="password"]{
border: 2px solid #3498db;
width: 220px;
}
.login input[type="submit"]{
width: 150px;
border: 2px solid #2ec71;
cursor: pointer;
}
.login input[type="text"]:focus, .login input[type="password"]:focus{
border-color: #2ecc71;
width: 280px;
transition: 0.5s;
}
.login input[type="submit"]:hover{
background-color: #2ECC71;
transition: 0.5s;
}
</style>
</head>
<body>
<form action="" class="login"method="">
<h1>Login 登录</h1>
<input type="text" placeholder="Username 用户名" />
<input type="password" placeholder="Password 密码" />
<input type="submit" value="Submit 提交" />
</form>
</body>
</html>
6778
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
