通过css3设置html5 placeholder字体样式

关注本头条号，专注做前台。

仍然记得在html5推行出来之前，做网页前台的日子，还需要JS来写才可以实现placeholder效果，自从htm5出来以后，这个工作的内容双手就基本被解放了

我们只知道placeholder的字体颜色会比输入字体颜色淡一点，但是，如何去设置一个placeholder的颜色呢？ 通过下面的方法：

/* 通使用 */::-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; }

考虑兼容性，要写很多个版本，相信在将来更规范以后，这个问题会得到处理

//

无实战，不前台——切图学院

报名地址：http://qietu.net