HTML placeholder attribute

placeholder attribute hints the user about data entry in the input field or textarea. Data entry means what kind of data should be entered in the input field.

Example

<p>First name: <input type="text" placeholder="john"></p>
 <p>Last name: <input type="text" placeholder="david"></p>
 <p>Email <input type="email" placeholder="[email protected]"></p>
 <p>Password <input type="password" placeholder="password"></p>
Try </>

placeholder attribute value

The value of this attribute is simple plain text.

Related Tags

The tags which support this attribute are as follows.

<input> tag

Example

<p>Password: <input type="password" name="pass" placeholder="at least 8 digit"></p>

Try</>

If the hint is longer than the width of input element, then small element should be used as side comment to hint the user. placeholder is not suitable for the older people and users with vision impairments.

See the follosing example to use a long hint.

Example

User name: <input type="text" name="fname" placeholder="john"> 
Password: <input type="password" minlength="8" placeholder="password"><small>(use strong passsword, the password excludes & and #)</small>

Try</>

The above example hints the user about password. The hint has been given as small comment on the right side of input control.



Was this article helpful?

 

Email:

Message:

Get the newsletter