Rumah >hujung hadapan web >tutorial css >Mengapakah CSS Saya `::after` Pseudo-element Render pada Kotak Pilih WebKit?

Mengapakah CSS Saya `::after` Pseudo-element Render pada Kotak Pilih WebKit?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-11-23 17:18:151069semak imbas

Why Doesn't My CSS `::after` Pseudo-element Render on a WebKit Select Box?

CSS :selepas Tidak Render dengan Kotak Pilih WebKit

Masalah:

Memanipulasi penampilan kotak pilihan dengan CSS :: selepas unsur pseudo untuk mencipta lungsur turun tersuai tanpa imej terbukti tidak berjaya. Walaupun menggunakan peraturan CSS yang sesuai, elemen :after kekal tidak kelihatan.

HTML:

<select name="">
  <option value="">Test</option>
</select>

CSS:

select {
  -webkit-appearance: none;
  background: black;
  border: none;
  border-radius: 0;
  color: white;
}

select::after {
  content: " ";
  display: inline-block;
  width: 24px;
  height: 24px;
  background: blue;
}

Pemerhatian:

Elemen :after gagal muncul walaupun penggayaan digunakan.

Penyelesaian:

Malangnya, nampaknya penyesuaian ini tidak dapat dilaksanakan pada masa ini disebabkan oleh pengehadan teknikal tertentu dalam penyemak imbas WebKit. Penyampaian kotak pilihan selalunya dikendalikan oleh sistem pengendalian dan bukannya penyemak imbas itu sendiri, mengehadkan keupayaan untuk mengawal penampilan mereka sepenuhnya melalui CSS.

Atas ialah kandungan terperinci Mengapakah CSS Saya `::after` Pseudo-element Render pada Kotak Pilih WebKit?. 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