Bagaimanakah Saya Boleh Mengalih Keluar Sempadan Fokus daripada Elemen Teks Input dalam Safari dan Chrome?

Menghapuskan Sempadan Fokus Elemen Teks Input

Apabila elemen teks input mendapat fokus, penyemak imbas tertentu, termasuk Safari dan Chrome, mungkin memaparkan sempadan biru sekeliling mereka. Walaupun isyarat visual ini boleh berguna untuk kebolehaksesan dan kebolehgunaan, ia mungkin tidak selalu diingini dalam reka letak reka bentuk tertentu.

Untuk mengalih keluar serlahan sempadan ini dalam Safari, gunakan CSS:

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

Ini penyasaran membolehkan anda mengasingkan elemen input yang diingini dengan kelas "tengah." Sebagai alternatif, untuk mempengaruhi semua elemen bentuk, gunakan:

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

Noah Whitmore mencadangkan untuk melanjutkan ini kepada elemen yang boleh diedit kandungan:

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

Akhirnya, anda juga boleh melumpuhkan garis fokus pada semua elemen dengan:

*:focus {
    outline: none;
}

Walau bagaimanapun, pendekatan ini tidak digalakkan atas sebab kebolehcapaian. Ingat bahawa garis fokus berfungsi sebagai penunjuk yang berguna untuk pengguna yang menavigasi antara muka.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengalih Keluar Sempadan Fokus daripada Elemen Teks Input dalam Safari dan Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!