Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Menukar Warna Latar Belakang Pilihan Kotak Terpilih?

Bagaimana untuk Menukar Warna Latar Belakang Pilihan Kotak Terpilih?

Linda Hamilton
Linda Hamiltonasal
2024-12-18 10:49:24629semak imbas

How to Change the Background Color of Select Box Options?

Cara Mengubah Warna Latar Belakang Pilihan Kotak Pilihan Apabila Dibuka

Dalam cuba menyesuaikan kotak pilihan, anda menghadapi kesukaran menukar latar belakang warna pilihannya apabila diaktifkan. Untuk menyelesaikan masalah ini, adalah penting untuk menyasarkan elemen HTML yang betul.

Penyelesaian:

Tidak seperti kotak pilihan itu sendiri, pengubahsuaian warna latar belakang harus digunakan pada elemen pilihan :

select option {
  background: rgba(0, 0, 0, 0.3);
}

Penyesuaian Lanjutan:

Untuk individu penggayaan, gunakan pemilih atribut:

select option[value="1"] {
  background: rgba(100, 100, 100, 0.3);
}

select option[value="2"] {
  background: rgba(150, 150, 150, 0.3);
}

Selain itu, anda boleh memanfaatkan atribut kelas untuk kawalan yang lebih halus:

<select>
  <option class="custom-option" value="1">Option 1</option>
  <option class="custom-option" value="2">Option 2</option>
</select>
.custom-option {
  background: blue;
}

Atas ialah kandungan terperinci Bagaimana untuk Menukar Warna Latar Belakang Pilihan Kotak Terpilih?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn