chrome 禁止element ui的input自动填充

背景:使用element-ui组件的el-input做登录界面,有账号和密码两个选择框

问题:chrome自带密码自动填充功能,填充之后input:-internal-autofill-selected默认属性会填充背景色,这个属性不能直接修改

解决方案:

在网上找了很多个方法,如什么设置密码框 的autocomplete="new-password",  这个没生效,可能chrome版本的问题。

还有是加一段CSS:

  /deep/ input:-webkit-autofill {
    box-shadow: 0 0 0 1000px #3b3d40 inset !important;
    -webkit-text-fill-color: #fff;
  }

虽然覆盖了:-internal-autofill-selected的默认背景色,但#3b3d40还是有颜色,不是完全透明。

最后终于找到了解决方法:

/deep/ input:-internal-autofill-previewed,
/deep/ input:-internal-autofill-selected {
      -webkit-text-fill-color: #FFFFFF !important;
      transition: background-color 5000s ease-in-out 0s !important;
       caret-color: #fff;
}

相当于把背景色隐藏了。

 

上一篇:C#中的访问修饰符


下一篇:利用Windbg分析高内存占用问题