一、發現該問題的原因-是在寫帳號登錄頁面時，input表單添加了背景圖片，當自動填充，搓搓的一坨淡黃色背景出來。
這個原因是我草率的直接設定在input元素裡面，結果問題就來了。所以如果把這個圖示放在input表單外面，就不會有這個問題。
二、表單自動填入會新增瀏覽器預設樣式怎麼處理和避免
第二張圖，就是表單自動填入後，chrome會預設為自動填入的input表單加上input:-webkit-autofill私有屬性
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
background-color: rgb(250, 255, 189); /* #FAFFBD; */
background-image: none;
color: rgb(0, 0, 0);
}看到這裡新增上這段程式碼，我會想到使用樣式覆蓋的方法解決。我完全可以使用!important去提升優先權。但是有個問題，加！ important不能覆蓋原有的背景、字體顏色，除了chrome預設定義background-color,background-images,color不能使用
!important提升優先級，其他屬性均可使用它來提升優先權。
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
background-color: #FFFFFF;
background-image: none;
color: #333;
/* -webkit-text-fill-color: red; //这个私有属性是有效的 */
}
input:-webkit-autofill:hover {
/* style code */
}
input:-webkit-autofill:focus {
/* style code */
}思路有兩個，1.通過打補丁，修復bug。 2.關閉瀏覽器自備填滿表單功能
情境一：input文字方塊是純色背景的
解決方法：
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 1000px white inset;
-webkit-text-fill-color: #333;
}情境二：input文字方塊是使用圖片背景的
解決方法：
if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0)
{
var _interval = window.setInterval(function () {
var autofills = $('input:-webkit-autofill');
if (autofills.length > 0) {
window.clearInterval(_interval); // 停止轮询
autofills.each(function() {
var clone = $(this).clone(true, true);
$(this).after(clone).remove();
});
}
}, 20);
}先判斷是否為chrome，如果是，則遍歷input:-webkit-autofill元素，再透過取值，附加，移除等操作來實現。 這個方法沒效果！ ！
所以最後我是不使用圖示當input表單的背景圖片，而是多寫一個標籤，把圖示拿到表單外面來。
思路二： 關閉瀏覽器自備填充表單功能
設定表單屬性 autocomplete="off/on" 關閉自動填入表單，自行實現記住密碼
