I want to pick all text box place holders and give it a generic style. What i have in mind:
<style>
.textbox > placeholder
{
font-size: 15pt;
}
</style>
I want to pick all text box place holders and give it a generic style. What i have in mind:
<style>
.textbox > placeholder
{
font-size: 15pt;
}
</style>
use this trick.
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: pink;
}
::-moz-placeholder { /* Firefox 19+ */
color: pink;
}
:-ms-input-placeholder { /* IE 10+ */
color: pink;
}
:-moz-placeholder { /* Firefox 18- */
color: pink;
}
<input type="text" placeholder="this is the placeholder text"/>
Cross browser code:
.textbox::-webkit-input-placeholder {
color: red;
}
.textbox:-moz-placeholder { /* Firefox 18- */
color: red;
}
.textbox::-moz-placeholder { /* Firefox 19+ */
color: red;
}
.textbox:-ms-input-placeholder {
color: red;
}
<input type="text" class="textbox" placeholder="I am placeholder" style="width: 200px;" />
Try this
input::-webkit-input-placeholder {
color: red;
}
For more reference https://css-tricks.com/snippets/css/style-placeholder-text/
Please check this link: https://davidwalsh.name/html5-placeholder-css,
example:
/* for all */
::-webkit-input-placeholder { color:#f00; }
::-moz-placeholder { color:#f00; } /* firefox 19+ */
:-ms-input-placeholder { color:#f00; } /* ie */
input:-moz-placeholder { color:#f00; }
/* field is id, individual: webkit */
#field2::-webkit-input-placeholder { color:#00f; }
#field3::-webkit-input-placeholder { color:#090; background:lightgreen; text-transform:uppercase; }
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999; }
/* individual: mozilla */
#field2::-moz-placeholder { color:#00f; }
#field3::-moz-placeholder { color:#090; background:lightgreen; text-transform:uppercase; }
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3p