input 輸入框 在自動填充時,背景顏色問題

2022-06-28 02:57:08 字數 930 閱讀 2941

問題:

自動填充前:

自動填充後:

可以看出,自動填充後,input背景顏色變成了白色,

解決辦法:

純色陰影覆蓋底色

input:-webkit-autofill
再看看,自動填充後的效果:

注意: 這個方法有個問題,就是input 輸入框,不能有 圓角(border-radius),而且只適用於純色背景框。

可以看到,兩邊有明顯的白色

2.設定透明:

input:-internal-autofill-previewed,

input:-internal-autofill-selected

效果:

3.利用動畫延遲

input:-webkit-autofill,

input:-webkit-autofill:hover,

input:-webkit-autofill:focus,

input:-webkit-autofill:active

效果:

推薦使用第二種或第三種.

**:

input輸入框在游標處, 插入文字段

在專案中會遇到這樣的情況,使用者可以在textarea中輸入,也可以選擇既有的可供選擇的 段落,現需求是使用者把游標放在哪,使用者選擇後的 段落就 插進 該處位置。實現方式主要是依靠倆點 一 利用 doxument.selection 這是ie的 docuemnt.getelementbyid x ...

谷歌瀏覽器給輸入框input自動填充密碼解決辦法

如下圖所示 因為圖上的input不是密碼框所以我們可以找到登陸頁面在登陸頁面的密碼框上新增屬性 autocompleted off text name username autocompleted off password name password autocompleted off 但是有的時候...

記錄下input輸入框自動填充的坑,附帶解決方法

當自動填充資料後,輸入框所展示的效果特別醜,會有自帶的填充樣式 解決方法 可以修改 webkit autofill中box shadow的屬性去改變輸入框自動填充的顏色 input webkit autofill 可以看下修改完後的效果 注意 如果需要使用透明色或者是有透明度的填充色,需要設定自動填...