Bagaimana untuk mengalih keluar Sempadan Biru Menjengkelkan daripada Butang dalam Chrome?

Alih keluar Sempadan Biru daripada Butang Gaya Tersuai dalam Chrome

Apabila menyesuaikan penampilan menggunakan CSS, adalah perkara biasa untuk mengalih keluar sempadan lalai untuk penampilan yang lebih bersih. Walau bagaimanapun, dalam Chrome, jidar biru yang menjengkelkan mungkin muncul di sekeliling butang apabila diklik.

Masalahnya:

Gaya penyemak imbas lalai mungkin mengatasi beberapa sifat CSS, termasuk yang berkaitan dengan fokus dan keadaan aktif. Dalam Chrome, butang mempunyai garis fokus biru apabila diklik, walaupun apabila jidar: tiada ditetapkan.

Penyelesaian:

Nota: Mengalih keluar fokus garis besar tidak disyorkan kerana ia boleh menjejaskan kebolehaksesan.

Jika anda masih ingin menyembunyikan sempadan biru, tambahkan CSS berikut peraturan:

button:focus {
  outline: 0;
}

Peraturan ini secara eksplisit mengalih keluar garis fokus, mengatasi tingkah laku penyemak imbas lalai.

Penjelasan:

Pseudo- :focus kelas dicetuskan apabila elemen menerima fokus (biasanya dengan mengklik atau tab). Dengan menetapkan garis besar: 0;, anda menghapuskan sempadan biru yang dikaitkan dengan keadaan fokus itu.

Penyelesaian Alternatif:

• Gunakan tag butang yang direka khusus untuk kebolehaksesan, seperti .
• Lumpuhkan garis besar semua butang menggunakan *{garis besar: 0}; (tidak disyorkan).
• Gunakan JavaScript untuk mengalih keluar garis fokus pada butang tertentu.

Pertimbangan Tambahan:

• Pastikan bahawa CSS anda dimuatkan dengan betul dan digunakan pada halaman.
• Kosongkan cache penyemak imbas anda untuk memuat semula gaya cache.
• Uji penyelesaian anda dalam berbilang penyemak imbas untuk memastikan keserasian merentas penyemak imbas.

Rujukan:

• [ Dokumen Web MDN - :focus](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar Sempadan Biru Menjengkelkan daripada Butang dalam Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!