Create A Registration Form In HTML Only

Create A Registration Form In HTML Only


Create A Registration Form In HTML Only

Today we will create a registration form in HTML without using any CSS or any other stuff, it's super simple and quick to create. We will use tables to format the registration form.

So let's start this simple web development tutorial. You can use this in your blog or for any other website or for practice.

No coloring, styling stuff will be in this tutorial we will cover that in the coming tutorials.

I will use Sublime Text 3 a free version for this tutorial. You can use other editors also notepad will also work. But the reason for not using notepad is that you can do the same stuff in less time in the modern text editors.


We will need to create another HTML page to redirect the form when submit button is clicked. so open another file and save it in the desktop or the same location where you save the form.html file in the same folder. NOTE: Inside the HREF attribute enter the exact path of the file. for example, if you have saved both the file in desktop then just enter redir.html as location else if you have saved both the file in different location like in local disk D and inside any folder in that drive then give the full path like D:your_folder_name\redir.html

This is how our form will look like. I know it is a very simple looking site but sooner or later we will work to create a more beautiful registration form. Below is the code you will use to create this simple looking basic HTML form which will do nothing but take user input and redirect to another page.


<!DOCTYPE html>
<html>
<head>
 <title>regestration form</title>
</head>
<body>
<form action="abc.html">
 <table border="1" align="center">
 <tr>
  <th colspan="2">REGISTRATION FORM</th>
 </tr>
 <tr>
  <td>Name</td>
  <td><input type="text" placeholder="Your name" required></td>
 </tr>
 <tr>
  <td>Address</td>
  <td><textarea cols="50" rows="10" placeholder="Your address"></textarea></td>
 </tr>
 <tr>
  <td>Genger</td>
  <td>
   Male:<input type="radio" name="gen" value="male">
   Female:<input type="radio" name="gen" value="female"> 
  </td>
  
 </tr>
 <tr>
  <td>Skills</td>
  <td>
   C:<input type="checkbox">
   C++:<input type="checkbox">
   JAVA:<input type="checkbox">
   JAVASCRIPT:<input type="checkbox">

  </td>
 </tr>
 <tr>
  <td>City</td>
  <td>
   <select>
    <option value="">select</option> 
    <option value="kolkata">Kolkata</option> 
    <option value="mumbai">Mumbai</option> 
    <option value="delhi">Delhi</option> 
    <option value="pune">Pune</option> 
   </select>
  </td>
 </tr>
 <tr>
  <td align="center" colspan="2">
   <input type="checkbox">I accept terms and contitions. <br>
   <button>Submit</button>
  </td>
 </tr>
 </table>
</form>
</body>
</html>

0 comments :

Post a Comment