HTML5 Logo

So I set out to add some placeholder text for login fields in my CakePHP project. First I tried the default attribute, and then started implementing some Javascript to clear the text from the field on focus.

Then I remembered the awesomeness that is HTML5 has introduced the placeholder attribute to the input tag. Placeholder text appears in the input field much like default text would – the difference being that placeholder text disappears when you start typing in the field, whilst default text would have to be deleted.

So:

<input name="fname" type="text" placeholder="First name" />

produces

And because HTML5 is so cool, if you delete the text from the input, the placeholder text re-appears.

By foxbeefly

PHP / MySQL Developer

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.