Wednesday, March 7, 2018

bio-data form using html


Prog-1. To create a simple student bio-data form using html5 . it should contain the following name (text box), address (multiline text box),gender (radio button male,female),skill sets known (check boxes – c,c++,java,C#etc), extra curricular activities (text box), nationality (combobox) ,submit and reset button.

<html>
 <body>
  <form>
  
   Name <br/>
   <input type="text" size="30" value="ABC">
   <br/><br/>

   Password <br/>
   <input type="password" >
   <br/><br/>
  
   Phone<br/>
   <input type="tel" name="Phone" maxlength="10">
   <br/><br/>
  
   Gender
   <input type="radio" name="gender" value="M" checked>Male
   <input type="radio" name="gender" value="F">Female
   <br/><br/>

   Languages known
<input type="checkbox">Telugu
   <input type="checkbox" checked>English
   <input type="checkbox">Hindi
   <br/><br/>

   Eduction
   <Select>
    <option>Graduation</option>
    <option selected>Post Graduation</option>
   </Select>
   <br/><br/>
skills
<input type="checkbox">C
   <input type="checkbox" checked>C++
   <input type="checkbox">JAVA
<br>
<br>
   Address <br/>
   <textarea rows="5" cols="30" style="resize: none;"></textarea>
   <br/><br/>
Nationality
<Select>
    <option>Indian</option>
    <option selected>Other</option>
   </Select>
<br>
<br>
 Extra curricular activities <br/>
   <textarea rows="5" cols="30" > </textarea>
   <br/><br/>
   Image<br/>
   <input type="file">  
   <br/><br/>

   <input type="reset" value="Reset">
   <input type="submit" value="Submit Form">
   </form>
 </body>
</html>

3 Comments:

At February 9, 2020 at 4:08 PM , Blogger Unknown said...

Output kudutha Nalla irukkum na

 
At October 15, 2023 at 9:12 PM , Blogger SAKTHI C said...

Output screenshot add panna usefull aa irukkum

 
At December 1, 2025 at 1:48 AM , Blogger Hire Front-end Developer said...

The guide on building a bio-data form with HTML is easy to follow and informative. For those seeking professional and efficient web form development, connecting with experts to Hire Frontend Developers can make the process smoother.

 

Post a Comment

Subscribe to Post Comments [Atom]

<< Home