Placeholder-HTML5 Form Enhancement: Input Types and Attributes

Placeholder-HTML5 Form Enhancement: Input Types and Attributes

Placeholder-HTML5 Form Enhancement: Input Types and Attributes

This article originally appeared in issue 213 of .net magazine – the world’s
best-selling magazine for web designers and developers.

Placeholder

This attribute enables us to set default text as we’d currently do in HTML4
with the value attribute. The difference is that the text is only displayed
when the field is empty and hasn’t received focus. Once the field receives
focus the text simply disappears, ready for data entry. It should only be
used for short descriptions. For anything longer, use the title attribute.
Let’s have a look at how to implement the placeholder attribute:

<input type="text" name="user-name" id="user-name" placeholder="User name is your email address">