Placeholder style settings, placeholder Style

Placeholder style settings, placeholder Style

In the input box, if you want to set the entered word and placeholder to different colors or other effects, you can use the following code to set the style of placeholder.

:-Webkit-input-placeholder {}/* browser using the webkit kernel */:-moz-placeholder {}/* Firefox version 4-18 */:: -moz-placeholder {}/* Firefox version 19 + */:-ms-input-placeholder {}/* IE browser */Note 1: write the corresponding input or textarea elements before the colon. Note 2: The placeholder attribute is a newly added attribute in css3. CSS selectors of IE9 and Opera12 do not support placeholder text. Eg: css Code # input-test {color: # FFC0CB; font-size: 1.2em; width: 180px; height: 36px;} # input-test :: -webkit-input-placeholder {color: # ADD8E6;} # input-text:-moz-placeholder {// I don't know why Firefox's placeholder is pink, I don't know how to change it. I hope Daniel will pass by and help me with color: # ADD8E6;} # input-text:-ms-input-placeholder {// because my IE is IE9, placeholder is not supported, so it cannot be tested. If you have more than IE10, try color: # ADD8E6 ;} html code <div id = "container"> <input id = "input-test" ty Pe = "text" placeholder = "Modify placeholder style"/> </div> shows the effect: PS: You can also modify the font-weight style of placeholder. Eg: I added "font-weight: bold;", as shown in: