Registration Page using HTML with CSS
| Previous | Home | Next |
This is the Html code for registration page as given below. Save this code with any name.html .
Html code
<html> <head> <title>User Registration </title> </head> <link href="ssma.css" rel="stylesheet" type="text/css"> </head> <body background="background-70.jpg"> <div align="center"> <h2><img src="logo.png" width="100" height="100"/> Welcome to Registration pages <img src="satisfaction.jpg" width="100" height="100"/></h2> <div class="hr"></div> <div id="table"><br/> <table align="center"> <tr> <td class="td1">First name:</td> <td class="td2"><input type="text" name="name" class="text" style="background-color: #C1C1FF" /></td> </tr> <td class="td1">Middle name:</td> <td class="td2"><input type="text" name="lastname" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Last name:</td> <td class="td2"><input type="text" name="middlename" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Email id:</td> <td class="td2"><input type="text" name="email" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Address:</td> <td class="td2"><input type="text" name="address" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Sex:</b></td> <td class="td2">male:<input type="radio" name="radio" values="redio"> Female:<input type="radio" name="radio" values="redio"><td> </tr> <tr> <td class="td1">Birthday</td> <td class="td2" style="background-color: #C1C1FF"> <select> <option>..Dates..<option> <option>1<option> <option>2<option> <option>3<option> <option>4<option> <option>5<option> <option>6<option> </select> <select> <option>..Month..<option> <option>Jan<option> <option>Feb<option> <option>March<option> <option>Aprial<option> </select> <select> <option>..Year..<option> <option>2001<option> <option>2002<option> <option>2003<option> </select> <td> </tr> <tr> <td class="td1">Languages</td> <td class="td2">Jave<input type="checkbox" name="checkbox1"> PHP<input type="checkbox" name="checkbox2">Asp.net <input type="checkbox"name="check"> C++<input type="checkbox" name="checkbox"></td> </tr> <tr> <td class="td1">Phone number:</td> <td class="td2"><input type="text" name="phonenumber" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Organization name</td> <td class="td2"> <select> <option>..Select..<option> <option>B222<option> <option>C333<option> <option>D444<option> <option>E555<option> <option>F666<option> <option>G777<option> </select> <td> </tr> <tr> <td class="td1">City:</td> <td class="td2"> <select> <option>..Select.. <option> <option>mumbai<option> <option>kolkata<option> <option>patna<option> <option>pune<option> <option>jaipur<option> <option>Hyderabad<option> </select> </td> </tr> <tr> <td class="td1">States:</td> <td class="td2"><select> <option>..Us-states..<option> <option>texas<option> <option>colifionia<option> <option>colorado<option> <option>north corolina<option> <option>georgia<option> <option>florida<option> </select></td> </tr> <tr> <tr> <td class="td1">Departmenet:</td> <td class="td2"><input type="text" name="dep" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Cell number:</td> <td class="td2"><input type="text" name="cell" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Fex number</td> <td class="td2"><input type="text" name="fex" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Centennial id</td> <td class="td2"><input type="text" name="cen id" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">password:</td> <td class="td2"><input type="text" name="password" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1">Re-password:</td> <td class="td2"><input type="text" name="repassword" style="background-color: #C1C1FF"></td> </tr> <tr> <td class="td1" align="left" width="50" height="30"> <input type="button" name="Submit" value="Submit"></td> <td class="td2" align="right" width="50" height="30"</div> <input type="button" name="Clear" value="Clear"></td> </tr> </table> </div> </div> </body> </html>
CSS Code
Save this code with any name.css and call in html page.
/* CSS Document */
#table{
border:5px;
}
.td1{
background-color:#999999;
font-weight:bold;
font-size:16px;
}
.td2{
background-color:#CCCCCC;
font:bold;
font-size:16px;
}
.hr{
background-color:#000000;
width:700px;
height:2px;
}
.text{
background-color:#FFC58A;
}
Output:
| Previous | Home | Next |