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;
}

相當於把背景色隱藏了。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM