CSS input 背景提示



/* 通用 */
::-webkit-input-placeholder { color:#f00; }
::-moz-placeholder { color:#f00; } /* firefox 19+ */
:-ms-input-placeholder { color:#f00; } /* ie */
input:-moz-placeholder { color:#f00; }

/* 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; }

/* 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; }

<p><input  autofocus="autofocus" id="field1" name="fname" type="text" placeholder="请输入你的姓名..." /></p>
<p><input id="field2" name="lname" type="text" placeholder="请输入你的昵称..." /></p>
<p><input id="field3" name="pass" type="password" placeholder="请输入你的新密码..." /></p>
<p><input id="field4" name="pass2" type="password" placeholder="请再次输入你的新密码..." /></p>

http://www.webhek.com/html5-placeholder-css/