CODEWITHSUNDEEP
htmlcss
chopper draw lion4
chopper draw lion4

Reputation: 13507

Simple way to make input text transparent

I know I can make a input form with default text by specifying the value attribute, but how do I make it so the text is transparent visually and also disappears when it is clicked? I want to make my text fields the way twitter does it.

All the resources I find seem overly complex and I would expect this to be as simple as setting a few attributes, but I just don't know which ones to set. I tried looking at twitters source code in chrome dev tools but I couldn't locate the code which enabled them to use transparent text that disappears when clicked.

Upvotes: 0

Views: 133

Answers (2)

Robbin Benard
Robbin Benard

Reputation: 1652

Try the placeholder attribute:

<input type="text" placeholder="Name">

Upvotes: 1

sampathsris
sampathsris

Reputation: 22290

You can use placeholder attribute for HTML5 supported browsers. E.g.:

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

For old browsers, it is not a trivial thing to implement. Please see these questions:

Upvotes: 3

Related Questions