HTML
Form Elements
Here you will learn some important HTML form elements. These elements are also known as controls in programming language.
Input
<input> is the fundamental form element for gathering user information through forms. This control is used for items that require only one line of user input, such as name, password etc.
Attribute | Description |
---|---|
name | It specifies the name of the text field |
type | It indicates the type of input control |
value | It refers to the contents of the text field |
Default value | It indicates the default value of the text field |
size | It allows to specify the width of the text-input control in terms of characters |
maxlength | It specifies the maximum number of characters that can be entered in text field |
Example
<!doctype html>
<html>
<head>
<title>Input Control</title>
</head>
<body>
<form>
<input type="text" name="firstname">
</form>
</body>
</html>
Select
Select field is used to provide predefined list of items to the user. The user can choose one or multiple options from the list depending upon the type of list.
<select> tag is used to create a list and <option> tag creates an item in the list.
Attribute | Description |
---|---|
name | It specifies the name of the select control |
size | This can be used to present a scrolling list box |
multiple | It specifies that multiple option can be selected at the same time by clicking CTRL key |
selected | It specifies that the current option is selected |
Example
<!doctype html>
<html>
<head>
<title>Select Control</title>
</head>
<body>
<form>
<select name="languages">
<option value="Maths" selected>Maths</option>
<option value="Physics">Physics</option>
</select>
</form>
</body>
</html>
Text Area
Text area is similar to text box but it may consist of multiple rows. It is used to get lengthy input from the user like comments and suggestions etc.
<textarea> tag is used to create text area in a form.
Attribute | Description |
---|---|
name | It specifies the name of the text area |
value | It specifies the contents of the text area |
default value | It specifies the default value of the text area |
row | It specifies the number of rows in the text area |
cols | It specifies the number of columns in the text area |
Example
<!doctype html>
<html>
<head>
<title>Text Area</title>
</head>
<body>
<form>
<textarea name="comment" rows="10" cols="30">
HTML stands for Hyper Text Markup Language. It is used to design web pages using markup language.
</textarea>
</form>
</body>
</html>
Button
<button> is a HTML element which represents a clickable button. It can be used anywhere in a document (so in form) where simple, standard button functionality is needed.
Attribute | Description |
---|---|
submit | It creates a button that automatically submits a form |
reset | It automatically resets form controls to their initial values |
button | It is used to trigger a client-side script when the user clicks that button |
image | It creates a clickable button but we can use an image as background of the button |
Example
<!doctype html>
<html>
<head>
<title>Button</title>
</head>
<body>
<button type="button">Click Me!</button>
</body>
</html>