<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#demo{ width:90%;height:300px;background-image:url(1.jpg);margin-top:100px; margin:0 auto;}
p{ font-size:30px;text-align:center;color:#FFF;padding-top:60px; line-height:6px;}
.ce{margin:0 auto;}
.de{border:1px solid white; border-radius:3px; background-color:rgba(255,255,255,0.2);margin-left:504px; width:200px;height:30px; margin-bottom:10px; color:#FFF;}
</style>
</head>
<body>
<div id="demo">
<p>Welcome</p>
<form action="" class="ce">
<input type="text" value="Username" style="text-align:center;" class="de"><br/>
<input type="text" value="Password" style="text-align:center;" class="de"><br/>
<input type="text" value="Login" style="text-align:center; background-color:#FFF;color:#74cdb9;" class="de">
</form>
</div>
</body>
</html>
效果如图：
HTML登录页面
原文地址：http://blog.51cto.com/13400327/2056970