CSS safari 浏览器的几个样式兼容问题
1. safari input框type["password"] type["text"] 聚焦后右侧出现图标
input::-webkit-credentials-auto-fill-button , // password
input::-webkit-contacts-auto-fill-button { // other
display: none !important;
visibility: hidden;
pointer-events: none;
position: absolute; /* 避免占用 input 元素额外的 padding，正常情况下存在 display: none!; 就可以了 */
right: 0;
}
2. safari 浏览器 input 框光标放大，输入文字后不居中样式解决
input {
line-height: normal;
vertical-align: middle;
}
3. 去掉阴影属性
注意非 radio，否则就不能正常显示 radio
input[type="text"], input[type="button"], input[type="submit"], input[type="password"], button, textarea {
-webkit-appearance: none;
}
4. safari 去除自动填充后有系统自带的背景色
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 1000px #fff inset!important;
background-color: #fff !important;
background-clip: content-box !important;
-webkit-text-fill-color: #fff!important;
}
