When a user clicks a radio button, that button becomes selected, and all other buttons in the same group become deselected. The following example demonstrates how to create radio buttons on an HTML form.
For Example
<html>
<body>
<h1>Radio button</h1>
<form action="">
Male:
<input type="radio" checked="checked"
name="Sex" value="male">
<br><br>
Female:
<input type="radio" name="Sex" value="female">
</form>
</body>
</html>
Check Box
The following example demonstrates how to create check boxes on an HTML page.
For example
<html>
<body>
<h1> Check Box </h1>
<form action="">
JAVA
<input type="checkbox" name="lan"
value="java">
<br><br>
C++
<input type="checkbox" name="lan" value="C++">
<br><br>
Python
<input type="checkbox" name="lan"
value="Python">
</form>
</body>
</html>
Text input fields
Text fields are use when we want the user to type letters, numbers, and so on in a form.
There are three types of text input Field use on forms
- Single-line text input Field
- Password input Field
- Multi-line text input Field
Single-line text input Field
This Field is use for things that require only single line of user input. single line text input field are create HTML <input> tag is knows as single line text input field.
for example
<html>
<body>
<h1> Text fields <h1>
<form action="">
First name:
<input type="text" name="firstname" />
<br><br>
Middle name:
<input type="text" name="middlename" />
<br><br>
Last name:
<input type="text" name="lastname" />
</form>
</body>
</html>
Password input Field
it is similar to single-line text input but it masks the character as soon as a user enters it. Password input Field are also creates HTML <input>tag but type attribute is set to Password. this is knows as Password input Field.
example
<html>
<body>
<h1> Password input Field </h1>
<form >
User ID : <input type = "text" name = "user_id" />
<br><br><br>
Password: <input type = "password" name = "password" />
</form>
</body>
</html>
Multi-line text input Field
The user is require to give details that longer than a single sentence. Multi-line input field are create HTML <textarea> tag. is know as Multi line input Field.
<html>
<body>
<h1>Multi-line text input Field</h1>
<form>
<textarea rows = "10" cols = "40" name = "description">
Enter description.....
</textarea>
</form>
</body>
</html>example
Button
Buttons are common items on a form. The following example demonstrates
how to create a button. We can define our own text on the face of the button.
EX
<html>
<body>
<h1>button</h1>
<form action="">
<input type="button" value="submit">
</form>
</body>
</html>
fieldset
A fieldset is a grouping of data fields. The following example demonstrates how to draw a border with a caption around our data.
<html>
<body>
<h1>Fieldset </h1>
<fieldset>
<legend>
Gender:
</legend>
<form action="">
Male <input type="text" size="3">
Female <input type="text" size="3">
</form>
</fieldset>
</body>
</html>
Select Box
A select box, also called drop down box.
Example
<html>
<body>
<h1>Select Box </h1>
<form>
<select name = "dropdown">
<option value = "Red" selected>Red</option>
<option value = "Yellow">Yellow</option>
<option value = "Bule">Bule</option>
<option value = "Black">Black</option>
</select>
</form>
</body>
</html>
If you have any queries regarding this article or if I have missed something on this topic, please feel free to add in the comment down below for the audience. See you guys in another article.
To know more about HTML form please check Wikipedia link click here
Stay Connected Stay Safe. Thank you.
0 Comments