HTML+CSS制作登录表单
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>html+css制作登录页面</title>
<style>
*{margin:0;padding:0;box-sizing:border-box;}
body{
background:#444;
}
form{
border-radius:10px;
margin:200px auto;
padding:20px;
width:400px;
background:#fff;
text-align:center;
}
form h2{
margin-bottom:20px;
}
form input{
border:none;
border:1px solid #444;
border-radius:5px;
margin:15px 0;
padding-left:10px;
width:100%;
height:50px;
font-size:18px;
}
form .submit{
border:none;
padding:0;
background:#20a53a;
color:#fff;
}
</style>
</head>
<body>
<form action="" method="">
<h2>登录</h2>
<input type="text" placeholder="请输入用户名" name="username">
<input type="password" placeholder="请输入密码" name="password">
<input type="submit" value="Log In" class="submit">
</form>
</body>
</html>