防止 Edge 和 Chrome 更改自动成形上的颜色

Question

我在我的网页上创建了一个嵌入式支付解决方案。当我付款并输入我的姓名、地址等信息后，Edge 和 Chrome（可能还有其他）会建议为我保存我的信息。没问题。当我进行新的付款时，浏览器会建议一些已保存的表单数据。对我来说也很好。但是，当我单击保存的信息时，为我填写的元素（名称、地址）的颜色会发生变化。使用表单数据之前，背景是透明的，而文本是#D8D8D8，使用表单数据之后，背景颜色变成#E5F1FB，文本颜色几乎是黑色。我希望背景变得透明（或保持透明）

如何防止浏览器在使用保存的表单数据时更改颜色？不知道这是否可能，如果可能的话，是否应该通过 Javascript (jQuery) 或 CSS 或其他东西来完成。

到目前为止我尝试过CSS：

.subscription_payment:-webkit-autofill,  
.subscription_payment:-webkit-autofill:hover,  
.subscription_payment:-webkit-autofill:focus,  
.subscription_payment:-webkit-autofill:active  
 {  
 -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";  
 -webkit-transition-delay: 9999s;  
 transition: color 9999s ease-in-out, background-color 9999s ease-in-out;  
 transition-delay: 9999s;  
 -webkit-box-shadow: 0 0 0 30px red inset !important;  
 -webkit-text-fill-color: blue !important;  
 -webkit-background-fill-color: yellow !important;  
 -webkit-box-shadow: 0 0 0px 1000px white inset !important;  
}

我在 Edge 和 Chrome 中尝试过。Chrome 中的文本颜色会发生变化，而 Edge 中则不会。背景颜色不变

阿尔伯特

Answer 1

如果你说的是自动填充，我通常会使用 CSS 的这个小片段来禁用背景颜色。

.subscription_payment:-webkit-autofill,  
.subscription_payment:-webkit-autofill:hover,  
.subscription_payment:-webkit-autofill:focus,  
.subscription_payment:-webkit-autofill:active  
 {
   -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";
   -webkit-transition-delay: 9999s;
   transition: color 9999s ease-out, background-color 9999s ease-out;
   transition-delay: 9999s;
}

希望这对您有帮助。