Advertisement

Login Signup Page Design using HTML only

 

Output Page

Login Signup Page Design using HTML only

The below HTML code will give the output exactly shown in the "Post Image". Save this code with filename give .html extension and run in any browser. We have to use tables to properly align the form elements. You can use any other image for loginuser.png image.

<html>
<head>
<title>Registration Form</title>
</head>
<body bgcolor="#9afac9" text="#58099b">
<table cellpadding="12" cellspacing="10" width="80%" height="60%" align="center">
<tr><td colspan="3" align="center"><h1><b><font face="OCR-A BT">USER REGISTRATION PAGE</font></b></h1></td></tr>
<tr>
<td width="30%"><img src="loginuser.png"></td>
<td width="35%" bgcolor="#bffd53">
<table>
<tr><td colspan="2" align="center"><font size="5px">New User? <b>Sign up!!!</b></font></td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>User Name</td><td><input type="text" name="username" placeholder="Your Name" required></td></tr>
<tr><td>Email</td><td><input type="text" name="email"></td></tr>
<tr><td>Set Password</td><td><input type="password" name="password"></td></tr>
<tr><td>Confirm Password</td><td><input type="password" name="conf password"></td></tr>
<tr><td align="right"><input type="submit" value="Sign Up"></td><td><input type="reset" value="Clear"></td></tr>
</table>
</td>
<td width="35%" bgcolor="#e3fd53">
<table>
<tr><td colspan="2" align="center"><font size="5px">Already an User? <b>Log in!!!</b></font></td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>User Name</td><td><input type="text" name="username"></td></tr>
<tr><td>Password</td><td><input type="password" name="password"></td></tr>
<tr><td colspan="2" align="center"><a href="file3.html"><input type="submit" value="Login"></a></td></tr>
</table>
</td>
</tr>
</table>
</body>
</html>

Try here:-

Post a Comment

0 Comments