漂亮的登录界面（附代码）

示例

         仅为界面，登录按钮不可使用！！！

 

代码

HTML5代码：

	
	
	


	

		

			账号：
			
		
		

			密码：
			
		
		

			
		
	

CSS代码：

@charset "utf-8";
body
{
	font-size: 18px;
	font-family: 微软雅黑;
	background: url('time.png') no-repeat top center;
	color: #FFF;
}
form,p
{
	padding: 0;margin: 0;border: 0;
}
form
{
	width: 620px;
	height: 250px;
	padding-top: 60px;
	margin: 250px auto;
	background: rgba(255, 255, 255, 0.3);
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, 0.3);
}
p
{
	margin-top: 15px;
	text-align: center;
}
p span
{
	width: 60px;
	display: inline-block;
	text-align: right;
}
.num,.pass
{
	width: 200px;
	height: 35px;
	border: 1px solid rgba(255, 255, 255, 0.3);
	padding: 2px 2px 2px 22px;
	border-radius: 5px;
	color: #FFF;
}
.num
{
	background: 5px center rgba(255, 255, 255, 0.1);
}
.pass
{
	background: 5px center rgba(255, 255, 255, 0.1);
}
.btn01
{
	width: 190px;
	height: 35px;
	border-radius: 3px;
	border: 2px solid #000;
	margin-left: 65px;
	background: #57b2c9;
	color: #FFF;
	border: none;
}

CSS中涉及的背景图片（‘time.png’）(可改换其他图片)