Comment empêcher les modifications de police lors du remplissage automatique de Chrome ?

Empêcher les modifications de police lors du remplissage automatique dans Chrome

Lors du remplissage automatique des champs de nom d'utilisateur et de mot de passe dans Chrome sous Windows à l'aide du gestionnaire de mots de passe intégré, les changements de police, ce qui peut perturber alignements. Cet article a pour objectif de fournir un correctif empêchant le changement de police.

Malgré les tentatives de modification du CSS de l'entrée à l'aide des balises : -webkit-autofill et !important, le changement de police persiste. Une solution plus efficace consiste à cibler la partie spécifique de l'entrée qui subit la modification.

En tirant parti du pseudo-élément :first-line, vous pouvez isoler et modifier la première ligne de texte dans l'entrée remplie automatiquement. Le code CSS suivant garantira que la police reste cohérente :

input {
  &:-webkit-autofill::first-line {
    font-family: Times, "Times New Roman", serif !important;
  }
}

Cela cible spécifiquement la première ligne de l'entrée remplie automatiquement, remplaçant le changement de police par défaut. Dans certains cas, d’autres éléments peuvent également être affectés par le changement de police. Pour résoudre ce problème, vous pouvez étendre le code CSS pour cibler des composants supplémentaires :

input {
  &:-webkit-autofill::first-line,
  &:-webkit-autofill,
  &:-webkit-autofill:hover,
  &:-webkit-autofill:focus,
  &:-webkit-autofill:active {
    font-family: Times, "Times New Roman", serif !important;
  }
}

En appliquant ces modifications CSS, vous pouvez empêcher le changement de police dans Chrome lors du remplissage automatique, en conservant l'alignement souhaité de votre formulaire de connexion.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!