html full form,HTML Form Elements

HTML Form Elements

This chapter describes all HTML form elements.

The Element

The most important form element is the element.

The element can vary in many ways, depending on the type attribute.

All

HTML input types are covered in the next chapter.

The Element (Drop-Down List)

The element defines a drop-down list:

Example

Volvo

Saab

Fiat

Audi

Try it Yourself »

The elements defines the options to select.

The list will normally show the first item as selected.

You can add a selected attribute to define a predefined option.

Example

Fiat

Try it Yourself »

The Element

The element defines a multi-line input field (a text area):

Example

The cat was playing in the garden.

Try it Yourself »

This is how the HTML code above will be displayed in a browser:

The cat was playing in the garden.

The Element

The element defines a clickable button:

Example

οnclick="alert('Hello World!')">Click Me!

Try it Yourself »

This is how the HTML code above will be displayed in a browser:

Click Me!

HTML5 Form Elements

HTML5 added the following form elements:

By default, browsers do not display unknown elements. New elements will not

destroy your page.

HTML5 Element

The element specifies a list of pre-defined options for an element.

Users will see a drop-down list of pre-defined options as they input data.

The list attribute of the element, must refer to the

id attribute of the element.

Example

An element with pre-defined values in a :

Try it Yourself »

HTML5 Element

The purpose of the element is to provide a secure way to authenticate users.

The element specifies a key-pair generator field in a form.

When the form is submitted, two keys are generated, one private and one public.

The private key is stored locally, and the public key is sent to the server.

The public key could be used to generate a client certificate to authenticate the user in the future.

Example

A form with a keygen field:

Username:

Encryption:

Try it Yourself »

HTML5 Element

The element represents the result of a calculation (like one

performed by a script).

Example

Perform a calculation and show the result in an element:

οninput="x.value=parseInt(a.value)+parseInt(b.value)">

0

100 +

=

Try it Yourself »

Test Yourself with Exercises!

HTML Form Elements

=

new in HTML5.

Tag

Description

Defines an HTML form for user input

Defines an input control

Defines a multiline input control (text area)

Defines a label for an element

Groups related elements in a form

Defines a caption for a

element

Defines a drop-down list

Defines a group of related options in a drop-down list

Defines an option in a drop-down list

Defines a clickable button

Specifies a list of pre-defined options for input controls

Defines a key-pair generator field (for forms)

Defines the result of a calculation