Bagaimanakah Saya Boleh Menyesuaikan Sorotan Pilihan Senarai Pilihan pada Hover?

Ubah suai Pilihan Senarai Pilihan Sorotan pada Tuding

Menyesuaikan rupa dan rasa pilihan senarai terpilih pada tuding boleh meningkatkan pengalaman pengguna. Satu permintaan biasa adalah untuk mengubah warna latar belakang lalai apabila pilihan dilegarkan. Malangnya, peraturan CSS "option:hover { background-color: red; }" gagal mencapai ini.

Penyelesaian:

Untuk menyelesaikan isu ini, gunakan bayang kotak inset:

select.decorated option:hover {
    box-shadow: 0 0 10px 100px #1882A8 inset;
}

Dalam contoh ini, kelas "berhias" digunakan pada kotak pilihan. Apabila pilihan dalam kotak pilihan yang dihias ini dituding di atas, bayangan kotak sisipan dengan warna #1882A8 digunakan, mewujudkan perubahan warna latar belakang yang diingini. Teknik ini secara berkesan mengatasi sorotan lalai dan menyediakan antara muka pengguna yang lebih disesuaikan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyesuaikan Sorotan Pilihan Senarai Pilihan pada Hover?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!