Pages

Sunday, February 13, 2011

Login Form

<div id="login">
<h3>Login</h3>
<table border="0">
<tr><td>Username</td><td>:</td><td><input type="text" id="username" name="username" size="30"/></td></tr>
<tr><td>Password</td><td>:</td><td><input type="password" id="password" name="password" size="30"/></td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td><input type="submit" id="submit" value="Log In"/></td></tr>
</table>
</div>

<style>
html, body, div, p, h1, h3 { margin: 0px; }
html { background: #eee; }
body { margin: 10px; }
#login { width: 30%; background: white; padding: 10px; -moz-border-radius: 4px; -moz-box-shadow: 0 0 2px #aaa;}
#login h3 { font: 16px sans-serif; font-weight: bold; text-align: center; margin: 0 0 5 0px; color: #444; }
table td { font: 12px sans-serif; color: #444; }
#username, #password { border: 1px solid #aaa; -moz-border-radius: 2px; padding: 2px; }
#username:hover, #password:hover { -moz-box-shadow: 0 0 2px gold; }
#username:focus, #password:focus { -moz-box-shadow: 0 0 2px lime; }
#submit { -moz-border-radius: 6px; border: 1px solid #eee; -moz-box-shadow: 0 0 2px #55a; padding: 2 10; cursor: pointer; background: #888; color: white; }
</style>

No comments:

Post a Comment