如何修改placeholder【占位符】样式

思路：

• 首先要获取到placeholder，获取到了之后才能改变它。
• 怎么获取？我们可以通过伪元素::placeholder来达到目的。

 这里还要看看::placeholder的兼容性，MDN公布目前此伪元素只兼容以下版本

• Chrome 56+
• Firefox 51+
• Safari 10.1+
• Opera 43+
• Edge 16+
• IE 11+
• iOS Safari 10.3+
• Android Browser 4.4+
• Android Chrome 56+

placeholder用于占位置，向用户提示。那么根据不同的项目要求，需要设置占位符的样式，以下代码可以帮助我们实现placeolder的颜色，透明度，字体大小，风格等等的设置。

css代码如下：

input::-webkit-input-placeholder {
                color: red;
                font-size: 1.5em;
                font-family: 楷体;
                font-weight: bold;
            }

效果如下：