web-dev-qa-db-fra.com

Google Chrome <input /> La couleur d'arrière-plan de remplissage automatique a-t-elle changé dans la version 72.0?

J'ai récemment remarqué dans Google Chrome il montre un fond de couleur bleue pour tous les éléments d'entrée qui sont des valeurs remplies automatiquement

Google Chrome auto fill background color

htmlgoogle-chromeinputautofill
10
Guruganesh

Oui, Google a changé la couleur d'arrière-plan de l'aperçu de remplissage automatique en GoogleBlue50. Vous pouvez trouver le problème ici: https://bugs.chromium.org/p/chromium/issues/detail?id=935991

Depuis Google Chrome 72 la nouvelle couleur de remplissage automatique est #E8F0FE/rgb(232, 240, 254). Jusqu'à Google Chrome 72 les champs de remplissage automatique étaient colorée avec #FAFFBD/rgb(250, 255, 189):

input {
  border: 1px solid black;
  padding: 4px 3px;
}
.show-autofill-new {
  background-color: #E8F0FE !important;
  background-image: none !important;
  color: #000000 !important;
}
.show-autofill-old {
  background-color: #FAFFBD !important;
  background-image: none !important;
  color: #000000 !important;
}
<input class="show-autofill-new" placeholder="since 72" type="text">
<input class="show-autofill-old" placeholder="until 72" type="text">

Remarque: Dans le cas où vous souhaitez remplacer la couleur de remplissage automatique, vous pouvez utiliser l'une des solutions fournies sur ces questions:

Il est prévu de diviser les règles CSS pour le remplissage automatique prévisualisé et le remplissage automatique sélectionné à l'avenir:

  • aperçu automatique (les champs sont remplis lors du survol de la suggestion de remplissage automatique).
  • remplissage automatique sélectionné (les champs sont remplis d'une suggestion de remplissage automatique).
8
Sebastian Brosch

Oui, Google a changé cela pour une raison inconnue.

Il était en cours de suivi, mais il ne dit pas pourquoi il a été modifié: https://bugs.chromium.org/p/chromium/issues/detail?id=935991

La mise à jour a fait son chemin dans Chrome Version 72.0.3626.119

À mon avis, cela ressemble trop au style handicapé. Je suppose que tous ceux qui utilisent Chrome est déjà habitué au fond jaune sur les entrées de remplissage automatique, donc cela peut causer beaucoup de confusion pour les utilisateurs maintenant.

Cependant, comme toutes choses, les gens finiront par s'habituer à la nouvelle couleur. Si vous voulez vraiment le récupérer, vous pouvez utiliser le CSS suivant:

input:-webkit-autofill, input:focus:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 100px rgb(250, 255, 189) inset;
}

Remarque: Ceci remplacera toute ombre de boîte que vous avez déjà appliquée à votre entrée.

2
Bruffstar

Oui c'est changé en bleu clair.

1
keshav khandelwal