The input tag

The input tag creates various HTML form elements: a regular input field, a password field, a checkbox, a radio button, and a button.

The input tag must be inside the form tag. This is not mandatory, it is necessary for sending data to the server and its subsequent processing via PHP.

Does not require a closing tag.

Attributes

Attribute	Description
type	Specifies the input field type. See options below.
value	Default value in the input field. In the case of a button, sets its text. For more information, see attribute value.
placeholder	Hint in the input field, for more details see attribute placeholder.
name	Input field name. This is needed to get the input field data into PHP. For the form to work correctly, the input field names should not match each other (in one form). If they do match, PHP will receive the data from the input field that is lower in the HTML code.
disabled	Blocks a form element (not just input, but almost any), for more details see attribute disabled.

Values ​​of the type attribute

Meaning	Description
text	Creates a regular text input field.
password	Creates a text input field for the password. Try typing text into it - it will be displayed as asterisks.
checkbox	Creates a checkbox. For more information, see checkbox.
radio	Creates a radio switch. For more information see radio.
hidden	Creates a hidden input that will not be visible on the screen, but will send the data contained in the value attribute to the server.
button	Creates a button. Clicking this button will not submit the form to the server. It can be used inside a link or via JavaScript. By default, the button has no text (example of a button without text: ), It is specified with value. See also the button tag, which also makes a button.
submit	Creates a button that will send data to the server. The button text depends on the browser, it can be changed with value. See also the button tag, which also makes a button.
reset	Creates a button that clears a completed form. The button text is browser-dependent and can be changed with value.
file	Creates a file selection button. The design of this button is not allowed to be changed via CSS (however, there are some clever ways). If you need such a field in a form, then the form tag must have the enctype attribute set to multipart/form-data.

New HTML5 type attribute values

These attribute values ​​are new and were introduced in HTML5, so they may not work in some browsers or may work differently in different browsers.

If the browser cannot understand the contents of the type attribute (for example, if it is not supported or misspelled), it will treat the element as a regular text input, as if type had a value of text.

Look at the examples below in different browsers. Try entering text in the inputs and clicking the send button. If the text is incorrect or the field is empty, the browser will return an error. For example, if you enter an incorrect email in a field with the type email, the browser will not let you send the form and will return an error message (the error text and its appearance in html css cannot be changed). If the field is empty, the browser will also return an error, this is achieved using the attribute required:

Meaning	Description
email
number
url
tel
search
color
date
month
week
datetime
datetime-local
range

See also