1. 程式人生 > 實用技巧 >css處理瀏覽器輸入框記住賬號密碼後的背景色

css處理瀏覽器輸入框記住賬號密碼後的背景色

谷歌瀏覽器、在記住密碼後,通常會給使用者密碼輸入框渲染上一個背景色,在有些時候這個瀏覽器自動使用的渲染背景色會影響系統本身的UI介面,所以下面提供css方法處理解決。

如圖所示的問題:

方法一:

input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {
    -webkit-text-fill-color: #ededed !important;
    -webkit-box-shadow: 0 0 0px 1000px transparent  inset !important;
    background
-color:transparent; background-image: none; transition: background-color 50000s ease-in-out 0s; //背景色透明 生效時長 過渡效果 啟用時延遲的時間 } input { background-color:transparent; }

方法二:關閉瀏覽器自帶填充表單功能

設定表單屬性 autocomplete="off/on" 關閉自動填充表單,自己實現記住密碼
 
<!-- 對整個表單設定 -->
<form autocomplete="off" method="
.." action=".."> <!-- 或對單一元素設定 --> <input type="text" name="textboxname" autocomplete="off">