Bagaimana untuk Menghentikan Autolengkap Chrome daripada Menukar Fon Medan Input?

Menghalang Perubahan Fon Tercetus Autolengkap Chrome dalam Medan Input

Pengguna Chrome pada Windows mungkin mengalami gangguan yang pelik apabila mengisi borang log masuk secara automatik: fon daripada input nama pengguna atau kata laluan berubah apabila menuding pada nama pengguna yang disimpan. Isu yang kelihatan kecil ini boleh mengganggu penjajaran elemen borang.

Untuk mengelakkan perubahan fon ini, sesetengah pihak mungkin menggunakan tetapan lebar tetap untuk medan input, tetapi ini hanya menutup masalah dan bukannya menanganinya. Penyelesaian yang lebih diingini ialah menghapuskan perubahan fon pada sumbernya.

Malangnya, teknik CSS konvensional, seperti menyasarkan medan input dengan :-webkit-autofill dan tetapan !penting untuk sifat berkaitan fon, telah terbukti tidak berkesan dalam kes ini.

Walau bagaimanapun, penyelesaian yang bijak telah ditemui:

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

Peraturan CSS ini secara khusus menyasarkan baris pertama teks yang diberikan dalam medan input autoisi, memastikan bahawa yang dikehendaki fon digunakan walaupun semasa autolengkap.

Dengan melaksanakan penyelesaian ini, pembangun boleh menghalang perubahan fon yang tidak diingini yang disebabkan oleh mekanisme autolengkap Chrome, memulihkan integriti borang log masuk mereka.

Atas ialah kandungan terperinci Bagaimana untuk Menghentikan Autolengkap Chrome daripada Menukar Fon Medan Input?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!