登录界面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
body{
background-color:lavender;
}
.text{
width: 220px;
height: 50px;
text-align: center;
border-radius: 40px; /*目标元素四角都为4px的圆角*/
margin: 0 0 0 48px;
}
h1{
color: white;
font-size: 80px;
font-family:Calibri;
margin: 0 0 -4px 0;
}
#submit{
width: 75px;
height: 40px;
font-size: 18px;
font-family:"微软雅黑";
background: none;
border-radius: 10px;
margin: 20px 0 0 125px;
}
#submit:hover{
background-color:white ;
cursor:pointer;
}
form{
position: absolute;
left: 480px;
top: 150px;
}
input:focus{
outline: none;
box-shadow: 0.5px 0.5px 1px 1px pink;
background: none;
}
</style>
</head>
<body>
<form method="post">
<h1>Welcome</h1>
<p><input type="text" class="text" name="zhanghao" placeholder="请输入账号" required/></p>
<input type="password" class="text" name="mima" placeholder="请输入密码" required/>
<br><input type="submit" name="submit" id="submit" value="登录"/></br>
</form>
</body>
</html>