重置input、textarea默认样式

问题1

在 ios 系统中，输入框有内阴影，需要去除。

-webkit-appearance: none ; //是为了去除内阴影样式，但是缺点是不可输入；
-webkit-user-select: auto; // 解决输入问题；

问题2

去除input和textarea聚焦边框

outline: none;

问题3

禁止textarea调整大小功能（去掉textarea元素右下角的小三角）

resize: none;

问题4

修改input、textarea的placeholder的样式

/* - Chrome ≤56,
   - Safari 5-10.0
   - iOS Safari 4.2-10.2
   - Opera 15-43
   - Opera Mobile >12
   - Android Browser 2.1-4.4.4
   - Samsung Internet
   - UC Browser for Android
   - QQ Browser 
*/
textarea::-webkit-input-placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}
/* Firefox 4-18 */
textarea:-moz-placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}
/* Firefox 19-50 */
textarea::-moz-placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}
/* - Internet Explorer 10–11
   - Internet Explorer Mobile 10-11 */
textarea:-ms-input-placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}
/* Edge (also supports ::-webkit-input-placeholder) */
textarea::-ms-input-placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}
/* CSS Working Draft */
textarea::placeholder {
  font-family: PingFangSC-Regular;
  color: rgba(0,0,0,0.3);
  font-size: 32px;
}

附加问题5

这个属性只用于iOS (iPhone和iPad)。
当你点击一个链接或者通过Javascript定义的可点击元素的时候，它就会出现一个半透明的灰色背景。要重设这个表现，你可以设置-webkit-tap-highlight-color为任何颜色。
想要禁用这个高亮，设置颜色的alpha值为0即可。

 -webkit-tap-highlight-color: rgba(255,0,0,0);