HTML forms are used to pass data to a server.
A form can contain input elements like text fields, checkboxes,
radio-buttons, select lists, text area, label submit buttons and more.
The most important form element is the input element.
The input element is used to select user information.
An input element can vary in many ways, depending on the
type attribute.
Text Fields
* type - Determines what kind of input field it will be.
Possible choices are text, submit, and password.
* name - Assigns a name to the given field so that you may
reference it later.
* size - Sets the horizontal width of the field.
The unit of measurement is in blank spaces.
* maxlength - Dictates the maximum number of characters
that can be entered.
HTML Code:
<input type="text" />
defines a one-line input field that a user can enter text into:
Password Field
<input type="password" />
defines a password field:
Now we using type, size, maxlength, name all are in one input field.
//Example:
<form>
Name:
<input type="text" size="10" maxlength="40" name="name"> <br />
Password:
<input type="password" size="10" maxlength="10" name="password">
</form>
Output:
Radio Buttons
Radio buttons are a popular form of interaction.
You may have seen them on quizzes, questionnaires, and other
web sites that give the user to choose right answer.
We use radio button when the use select only one option like the
question is select your gender its mean user select male or female
any on of them when we use radio buttons.
* name - defines which set of radio buttons that it is a part of.
its help to select only one options without name user can select both.
HTML Code:
<form>
Gender:
<input type="radio" name="gender">Male
<input type="radio" name="gender">Female
</form>
Output:
Gender:
Check Boxes
Check boxes allow user to select multiple items for a certain group.
The check box's use only when we need to select single or multiple
option and the radio button use when we choose single option.
HTML Code:
<form>
Select your Favourite Language.
<input type="checkbox" > HTML & CSS
<input type="checkbox" > PHP
<input type="checkbox" > C#
<input type="checkbox" > Python
</form>
Output:
Select your Favourite Language.
Drop Down Lists
Drop down menues are created with the <select> and <option> tags.
<select> is the list itself and each <option> is an available choice
for the user.
HTML Code:
<form>
Select Your Degree:
<select>
<option>Choose One</option>
<option>Some High School</option>
<option>High School Degree</option>
<option>Some College</option>
<option>Bachelor's Degree</option>
<option>Doctorate</option>
</select>
</form>
Output:
Select Your Degree:
SUBMIT Button
Now we add the submit Button in the form. Generally, the submit button
should be the last item of your form and have its value attribute
set to "Send" or "Submit" or anyone you want.
Value defines what the label of the button will be.
HTML Code:
<form>
<input type="submit" value="Submit">
</form>
Output:
