placeholder伪元素（有的浏览器版本把它当做伪类）可以用来对form中input等控件应用样式
1 <!doctype html> 2 <html lang="zh"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta name="description" content=""> 7 <meta name="author" content=""> 8 9 <title>Template Index</title> 10 11 <style> 12 ::-webkit-input-placeholder { 13 color: red; 14 } 15 ::-moz-placeholder { /* Firefox 19+ */ 16 color: red; 17 } 18 :-ms-input-placeholder { 19 color: red; 20 } 21 :-moz-placeholder { /* Firefox 18-*/ 22 color: red; 23 } 24 </style> 25 26 </head> 27 <body> 28 29 <input type="email" placeholder="qiu_deqing#qq.com"/> 30 31 32 </body> 33 </html>
效果如下
由于这个方法没有标准型，所以导致各种不同浏览器支持不一样，可能会变动很大，如需在获得焦点时改变样式:focus::-moz-placeholder {}
目前支持的样式属性：
fontcolorbackgroundword-spacingletter-spacingtext-decorationvertical-aligntext-transformline-heighttext-indentopacity