怎样修改输入框placeholder文字颜色大小？

placeholder属性主要用于提供可描述输入字段预期值的提示信息（hint）。该提示会在输入字段为空时显示，并会在字段获得焦点时消失。placeholder属性适用于以下的 <input> 类型：text, search, url, telephone, email 以及 password，也适用于textarea文本框。

了解HTML5的人应该知道，placeholder是HTML5中新增的属性，该属性的作用是规定可描述输入字段预期值的简短的提示信息，该提示会在用户输入之前显示在输入字段中，会在用户输入字段后消失，有些浏览器则是获得焦点后该提示便消失（如Safari、IE）。因为是HTML5中新增的属性，所以会存在兼容性问题，下面益吾库就顺便说说浏览器的支持情况：

IE10+、Firefox、Opera、Chrome 和 Safari 均支持 placeholder 属性。IE9及以下版本不支持input的placeholder属性。多数国产浏览器都与这些浏览器同内核，较新版本浏览器应该都已支持。

placeholder的用法实例：

<input type="text" placeholder="请输入您的称呼">

运行后你会发现，该提示文字会有自己默认的颜色，因浏览器而异，字号则是继承input样式font-size定义。有的时候，我们并不希望采用浏览器默认颜色，而且还想更改字体大小，这种情况该怎么办呢？好在有万能的hack css，以下为具体样式代码：

<style>
        input::-webkit-input-placeholder{
            color:red;
        }
        input::-moz-placeholder{   /* Mozilla Firefox 19+ */
            color:red;
        }
        input:-moz-placeholder{    /* Mozilla Firefox 4 to 18 */
            color:red;
        }
        input:-ms-input-placeholder{  /* Internet Explorer 10-11 */ 
            color:red;
        }
</style>

针对不同浏览器或不同版本的浏览器需用不同写法，需要添加相应的前缀，值得注意的是：

1、WebKit, Blink, Edge浏览器等需要带上-webkit-前缀，且是双冒号，写的时候还要带上input；

2、针对火狐浏览器则有两种写法，一种是针对低版本，一种是针对高版本，二者都需要带上-moz-前缀。要点1：火狐低版本的使用冒号（:），而高版本的使用双冒号（::）；要点2：火狐浏览器不需要像webkit内核那样要带上input；

3、由于placeholder属性只在IE10+才支持，因此，针对IE10、IE11的写法是加上-ms-前缀，使用的是冒号（:），需要带上input。

看到这里，相信你对placeholder属性自定义样式已有充分了解，而且关于伪类样式的冒号与双冒号问题，也有了一个初步了解。如果还有疑问，欢迎留言探讨。