表单相关css技巧

一:表单默认外观样式重置

表单中的input[type = "button"]、 input[type = "submit"]和input[type = "reset"]按钮在iPhone的safari浏览器下有一个圆角bug;

input[type="text"]文本输入框会有内阴影

解决办法:

input{
    -webkit-appearance: none;
}

正常情况显示:

iphone下显示:

二:表单元素被点击时产生的边框如何去掉(存在兼容)

a,button,input,textarea{
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  -webkit-user-modify:read-write-plaintext-only;        
}

三:改变placeholder的字体颜色

input::-webkit-input-placeholder{color:#AAAAAA;}
input:focus::-webkit-input-placeholder{color:#EEEEEE;}

四:取消input下在输入时默认英文首字母大写

<input autocapitalize="off" autocorrect="off" />

  

  

原文地址:https://www.cnblogs.com/yuanyuan0809/p/5319445.html