In this section, we will learn what the placeholder attribute is and how to use it.

What is placeholder Attribute in HTML <input> Tag?

For those <input> elements that take text content as their value, sometimes users get confused on what kind and how to put the necessary data into those fields.

For this reason, we can use the placeholder attribute to create an example of the type and format of values the target <input> field takes.

The value of the placeholder attribute is basically the sample value. This value appears as a light gray content in the body of the target field to show the format users should follow to enter data.

Also, as soon as users put data into the target field, that sample value will disappear.

HTML placeholder Attribute in <input> Tag Syntax:

<input type = “type” placeholder = “value”>

Example: using placeholder attribute in HTML <input> tag

See the Pen using placeholder attribute in HTML <input> tag by Omid Dehghan (@odehghan) on CodePen.