Bagaimanakah Saya Boleh Mengalih Keluar Sorotan Fokus Input Lalai dalam Pelayar Berbeza?

Mengalih keluar Sorotan Fokus Teks Input Lalai

Banyak penyemak imbas, termasuk Safari dan Chrome, menambah jidar biru di sekeliling elemen input terfokus secara automatik. Ini boleh menjadi gangguan visual, terutamanya dalam susun atur tertentu. Walaupun sesetengah penyemak imbas membenarkan tingkah laku ini dikawal, mencari penyelesaian yang berfungsi merentas penyemak imbas yang berbeza boleh menjadi mencabar.

Mujurlah, CSS menyediakan penyelesaian kepada masalah ini. Dengan menggunakan sifat outline-width, anda boleh mengalih keluar garis fokus daripada elemen input. Berikut ialah contoh:

input.middle:focus {
    outline-width: 0;
}

Coretan ini menyasarkan elemen input dengan kelas "tengah" dan menghapuskan garis fokus. Anda juga boleh menggunakan sifat garis besar untuk mencapai kesan yang sama untuk semua elemen bentuk asas:

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

Untuk mengendalikan elemen dengan atribut boleh diedit kandungan, yang menjadikannya jenis elemen input dengan berkesan, gunakan peraturan CSS ini:

[contenteditable="true"]:focus {
    outline: none;
}

Sebagai langkah terakhir, anda boleh melumpuhkan garis fokus pada semua elemen dengan kad bebas pemilih:

*:focus {
    outline: none;
}

Ingat, melumpuhkan garis fokus boleh menjejaskan kebolehcapaian dan kebolehgunaan tapak web anda, kerana pengguna bergantung padanya untuk mengenal pasti elemen yang difokuskan pada masa ini. Pertimbangkan kaedah alternatif untuk menjadikan fokus kelihatan apabila mengalih keluar serlahan lalai.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengalih Keluar Sorotan Fokus Input Lalai dalam Pelayar Berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!