ios输入框(input)背景色为白色无法去除

在开发中遇见ios高版本的输入框有个默认背景色为白色,且radius也继承了外面div的样式。

在网上学习后,了解到是在ios中,background的transparent属性是无效的,因此在安卓中看似正常的但在ios高版本手机中会出现这种不透明的情况。为了解决这一问题,我在全局样式中加入了下面两端css样式。

1、使得选择历史记录中的值后,输入框背景色不会改变。

input:-webkit-autofill {
  transition: background-color 5000s ease-in-out 0s;
}
2、消除ios存在的输入框不透明问题
input {
  -webkit-appearance:none;
  border-radius: 0;
  outline:none;
  background:ragb(0,0,0,0)
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}

如果在使用了上述第二段代码后,ios的异常还是没有解决,可以看一下自己的input标签中,是否写着 type=“search”,因为这一段代码会使得输入框具有默认样式。

<input   className="weui-search-bar__input" type="search" id="searchInput1" onKeyUp={searchThisName}  value={customerName1} onChange={changeName} placeholder="请输入客户名称" required />

只要将type="search"去掉即可。

希望文章对您有帮助。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
THE END
分享
二维码
< <上一篇
下一篇>>