Wie kann verhindert werden, dass die automatische Ausfüllung von Chrome Ihre Schriftart ändert?

Chrome-Herausforderung beim automatischen Ausfüllen von Schriftarten meistern

Wenn Sie unter Windows auf die Funktion zum automatischen Ausfüllen von Chrome stoßen, kann es sein, dass Sie auf ein lästiges Problem beim Ändern der Schriftart stoßen. Wenn Sie mit der Maus über gespeicherte Benutzernamen fahren, ändern sich Schriftgröße und -stil, wodurch die Ausrichtung Ihres Formulars gestört wird. Während Sie der Eingabe eine feste Breite zuweisen können, um dieses Problem zu mildern, besteht eine effektivere Lösung darin, die Änderung der Schriftart insgesamt zu verhindern.

Um dies zu erreichen, können Sie CSS-Regeln verwenden, die speziell auf das :-webkit-autofill abzielen Pseudoklasse. Diese Pseudoklasse gilt für Bereiche des Formulars, die vom Passwort-Manager von Chrome automatisch ausgefüllt werden. Durch Anwenden von „wichtig“ auf die Eigenschaft „Schriftfamilie“ innerhalb dieser Regel können Sie das Standardverhalten von Chrome überschreiben und Ihre gewünschten Schriftarteinstellungen beibehalten.

Hier ist ein Beispiel, wie Sie dies in SCSS implementieren können:

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

Alternativ benötigen Sie möglicherweise nur die folgende Regel:

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

Das Pseudoelement ::first-line zielt auf die erste Zeile der Eingabe ab, in der normalerweise das automatische Ausfüllen erfolgt.

Durch die Integration dieser CSS-Regeln können Sie die Änderung der automatisch ausgefüllten Schriftart von Chrome effektiv verhindern und so die Ausrichtung und Ästhetik Ihres Anmeldeformulars beibehalten.

Das obige ist der detaillierte Inhalt vonWie kann verhindert werden, dass die automatische Ausfüllung von Chrome Ihre Schriftart ändert?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!