#-webkit-autofill# #google # How to override a yellow background when auto Fill is enabled for forms

#-webkit-autofill# #google # How to override a yellow background when auto Fill is enabled for forms

When the form is automatically populated with the Google and opera browsers, the input box turns into a yellow background and a black font. Such as.

This will be inconsistent with the overall design style of the Web page, how to customize the style, to cover the yellow background.

Let's start by looking at what is causing, right-clicking on the element style:

Input:-webkit-autofill,textarea:-webkit-autofill, select:-webkit-autofill{ 　　 RGB (255, 189); 　　 background-image: none; 　　 color: RGB (0, 0, 0); } at a glance,-webkit-autofill re-renders the background color and font color of input. Ok, reason found, solution also has, rewrite-webkit-autofill1, not working (no effect)Input:-webkit-autofill,textarea:-webkit-autofill, select:-webkit-autofill{ RGB (255, 255, 255); Background-image:none;ColorRGB (102, 102, 102);}2, not working (no effect)Input:-webkit-autofill,textarea:-webkit-autofill, select:-webkit-autofill{ RGB (255, 255, 255)!important; Background-image:none!important;ColorRGB (102, 102, 102)!important;}3, working (effect)Input:-webkit-autofill,textarea:-webkit-autofill, select:-webkit-autofill{ -webkit-box-shadow:0 0 0 50px White inset; /* Change the color to your own background color */
-webkit-text-fill-color: #666;} The yellow fill color of the OK form is gone,

#-webkit-autofill# #google # How to override a yellow background when auto Fill is enabled for forms