Wie kann ich Schriftartänderungen beim automatischen Ausfüllen von Chrome verhindern?

Schriftartänderungen beim automatischen Ausfüllen in Chrome verhindern

Beim automatischen Ausfüllen von Benutzernamen- und Passwortfeldern in Chrome unter Windows mithilfe des integrierten Passwort-Managers ändert sich die Schriftart, was zu Störungen führen kann Ausrichtungen. Ziel dieses Artikels ist es, eine Lösung bereitzustellen, die die Änderung der Schriftart verhindert.

Trotz Versuchen, das CSS der Eingabe mithilfe der Tags -webkit-autofill und !important zu ändern, bleibt die Änderung der Schriftart bestehen. Eine effektivere Lösung besteht darin, auf den spezifischen Teil der Eingabe abzuzielen, der die Änderung erfährt.

Durch die Nutzung des Pseudoelements :first-line können Sie die erste Textzeile innerhalb der automatisch ausgefüllten Eingabe isolieren und ändern. Der folgende CSS-Code stellt sicher, dass die Schriftart konsistent bleibt:

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

Dies zielt speziell auf die erste Zeile der automatisch ausgefüllten Eingabe ab und überschreibt die Standardschriftartänderung. In manchen Fällen können auch andere Elemente von der Schriftartänderung betroffen sein. Um dieses Problem zu beheben, können Sie den CSS-Code erweitern, um auf zusätzliche Komponenten abzuzielen:

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

Durch die Anwendung dieser CSS-Änderungen können Sie die Änderung der Schriftart in Chrome während des automatischen Ausfüllens verhindern und so die gewünschte Ausrichtung Ihres Anmeldeformulars beibehalten.

Das obige ist der detaillierte Inhalt vonWie kann ich Schriftartänderungen beim automatischen Ausfüllen von Chrome verhindern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!