Table of Content
The <input> tag specifies an input field where the user can enter data.
<input> elements are used within a <form> element to declare controls that allow users to input data. An input field can vary, depending on the type attribute.
Note: The <input> element is empty, it contains attributes only. Use the <label> element to define labels for <input> elements.
How to use single-line text inputs in HTML?
A single-line text input, which allows only one line of text to be entered, is one of the many controls that’s declared with the input element. In this case, the input element should present the value “text” in the type attribute.
With this alone, the control is already visible, but a name is needed if there’s an intention to gather the data entered by the user in this control. The value of the name attribute will identify, server-side, the user’s input in the control. The following example shows a basic implementation of text input. Additionally, we’re enclosing the control and its label in a paragraph, as these two can be considered to form a unit with an idea that separates it from the rest.
How to use multiple line text inputs?
This type of control is very similar to the previous, but it has the particularity of allowing multiple lines of text to be entered. A multi-line text control is usually rendered as a box, tall enough to contain more than one line of text at the same time. This representation usually provides a scrollbar mechanism to allow users to see all entered text, particularly when it’s long enough to exceed the box boundaries.
A multi-line text input is inserted with the textarea element. Like before, the name attribute provides a name for the control that will help processing agents to identify the data submitted by the user.
What are the additional input attributes?
In addition to the attributes that operate on all <input> elements regardless of their type, text inputs support the following attributes: maxlength, minlength, pattern, placeholder, readonly, size, and spellcheck.
What does the input value mean in HTML?
How to validate an input?
<input> elements of type text have no automatic validation applied to them (since a basic text input needs to be capable of accepting any arbitrary string), but there are some client-side validation options available, which we’ll discuss below.
What does the required attribute do in HTML?
You can use the required attribute as an easy way of making entering a value required before form submission is allowed.