Bagaimana untuk Mencegah Perubahan Fon Semasa Autolengkap Chrome?

Halang Perubahan Fon semasa Autolengkap dalam Chrome

Apabila mengisi automatik medan nama pengguna dan kata laluan dalam Chrome pada Windows menggunakan pengurus kata laluan terbina dalam, fon berubah, yang boleh mengganggu penjajaran. Artikel ini bertujuan untuk memberikan pembetulan yang menghalang perubahan fon.

Walaupun percubaan untuk mengubah suai CSS input menggunakan : -webkit-autofill dan tag !important, perubahan fon berterusan. Penyelesaian yang lebih berkesan ialah menyasarkan bahagian khusus input yang mengalami perubahan.

Dengan memanfaatkan elemen pseudo baris pertama, anda boleh mengasingkan dan mengubah suai baris pertama teks dalam input yang diisi automatik. Kod CSS berikut akan memastikan fon kekal konsisten:

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

Ini menyasarkan baris pertama input autoisi secara khusus, mengatasi perubahan fon lalai. Dalam sesetengah kes, elemen lain juga mungkin dipengaruhi oleh perubahan fon. Untuk menangani perkara ini, anda boleh mengembangkan kod CSS untuk menyasarkan komponen tambahan:

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

Dengan menggunakan pengubahsuaian CSS ini, anda boleh menghalang perubahan fon dalam Chrome semasa autolengkap, mengekalkan penjajaran yang dikehendaki bagi borang log masuk anda.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Perubahan Fon Semasa Autolengkap Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!