以前想要实现文本框输入信息后，提示信息就会隐藏的效果，得使用用JavaScript实现。HTML5提供了文本框(INPUT)里对placeholder属性的原生支持，效果比JS更好。
placeholder颜色的修改方法
使用CSS修改HTML5 input placeholder颜色
HTML：
<input type="text" name="first_name" placeholder="你的姓名..." />
CSS:
::-webkit-input-placeholder { /* WebKit browsers */
color: #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #999;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #999;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #999;
}
即可单独将placeholder颜色设置为#999999灰色。
检查浏览器是否支持Placeholder属性
因为placeholder是一种新属性，很有必要检查一下你的浏览器是否支持它，比如IE6、IE8肯定是不支持的：
function hasPlaceholder() {
var input = document.createElement('input');
return ('placeholder' in input);
}
如果返回false，不支持placeholder，有需要该效果同步支持IE系列，那可能就需要用老办法，使用JS单独设置了。
placeholder美化
类似设置placeholder的颜色，同样可以设置placeholder的其他设置。比如字体、背景色、字距等等：
/* all */
::-webkit-input-placeholder { color:#f00; }
::-moz-placeholder { color:#f00; } /* firefox 19+ */
:-ms-input-placeholder { color:#f00; } /* ie */
input:-moz-placeholder { color:#f00; }
/* 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:3px; color:#999; }
OVER