摘要: <!DOCTYPE html> <html> <head> <mete charset="utf-8">  
<!DOCTYPE html>
<html>
<head>
<mete charset="utf-8">
<title>登录页面</title >
<style type="text/css">
*{margin: 0;padding: 0;}
body{
background: #151517;
}
div{
width: 400px;
height: 350px;
margin: 200px auto;
background: rgba(188,185,198,0.4);
border-radius: 10px;
text-align: center;
}
img{
width: 80px;
border-radius: 50%;
margin-top: 50px;
}
input{
width: 300px;
height:30px;
margin-top:15px;
border-radius: 6px;
border: none;
padding-left: 15px;
}
botton{
border: none;
width: 200px;
height: 35px;
border-radius: 6px;
background: #151517;
color: #fff;
}
</style>
</head>
<body>
<div>
<img src="http://cdn.duitang.com/uploads/item/201409/25/20140925003424_uzG3A.thumb.700_0.jpeg">
<form action=""method="">
<input type="text" name=""placeholder="请输入用户名..."><br>
<input type="password" name=""placeholder ="请输入密码..."><br>
<button>登录</button>
</form>
</div>
</body>
</html>
批改老师:灭绝师太批改时间:2019-03-26 16:48:31
老师总结:边框在后期布局的使用频率还是很高的,多多练习!