<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
padding: 0;
margin: 0;
}
div {
width: 356px;
height: 339px;
margin: 0 auto;
}
h1 {
width: 49px;
height: 49px;
background-color: #ff4c00;
background-image: url(./images/mi-logo.png);
margin: 0 auto;
}
h2 {
text-align: center;
margin: 35px 0px;
}
.input {
width: 356px;
height: 50px;
margin: 15px 0px;
text-align: left;
}
.submit {
width: 356px;
height: 50px;
padding-left: 0;
background-color: #ff4c00;
color: white;
border: none;
}
</style>
</head>
</style>
<body>
<div>
<h1></h1>
<h2>小米账号登录</h2>
<form action="" method="post">
<p><input type="text" placeholder="邮箱/手机/小米ID " class="input"></p>
<p><input type="password" placeholder="密码" class="input"></p>
<p> <input type="submit" class="submit" value="登录"></p>
</form>
</div>
</body>
</html>
效果