Friday, July 18, 2014

Sign up Form

  • Sign up example 

Now we all know whats text boxes in html and how to use them and we learn about more inputs just like Buttons,Check Boxes,.....etc 

All these are used in different things for different purposes but if we want to make a page to allow our users to sign up to our website just like the facebook one or any other sign up page its not that hard anymore so lets Do it:

  1. lets open sublime or notepad
  2. first of all i want to make a table which has a 2 columns and each column has 4 or 5 rows why because its more beautiful to do it in a nice way 
  3. lets write this:
     <html>
       <head>
        <title>Sign up</title>
        </head>
            <body>
                <table width="50%" >
                  <tr>
                     <td>
                     <label>Your Full Name</label>
                   </td>
                   <td>
                       <input type="text" width="15px;">
                   </td>
                    </tr>
                       <tr>
                      <td>
                         <label>Email</label>
                       </td>
                      <td>
                          <input type="text" width="15px;">
                        </td>
                       </tr>
                        <tr>
                        <td>
                          <label>Gender</label>
                        </td>
                        <td>
                          <input type="radio">Male
                          <input type="radio">Female
                         </td>
                        </tr>
                           <tr>
                        <td>
                      <label>Birthday</label>
                       </td>
                      <td>
                      <select >
                       <option>Day</option>
                        <option>1</option>
                       <option>2</option>
                       <option>.....etc</option>
                      </select>
                      <select>
                       <option>Month</option>
                       <option>Jan</option>
                       <option>Feb</option>
                        <option>.....etc</option>
                         </select>
                        <select>
                          <option>Year</option>
                             <option>1993</option>
                              <option>1994</option>
                                 <option>....etc</option>
                                </select>
                               </td>
                          </tr>
                        <tr>
                              <td>
                              </td>
                        <td>
                   <input type="button" width="50px;" height="30px;" value="Sign Up">
                        </td>
                          </tr>
                          <tr>
                        <td>
                       </td>
                        <td>
                 <input type="checkbox" >i agree the using ..........
                       </td>
                       </tr>
                  </table>
</body>
</html>
     3.it should looks like this :
             

     4.i hope you like it guys and if there's any question please ask me :) and dont forget to press ctrl+s to              save it and dont forget the ".html" too 

No comments:

Post a Comment