Cara Memohon :hover Styles to :before and :after Pseudo-elements?

:hover Syarat untuk :sebelum dan :selepas Elemen

Isu

Anda menghadapi kesukaran menggunakan ":hover" pada ":before" elemen. Percubaan untuk menggunakan ":before:hover" telah terbukti tidak berkesan.

Penjelasan

Sintaks yang betul untuk menggunakan gaya pada elemen ":before" berdasarkan status ":hover" elemen induk ialah :hover:before atau a:visited:before. Elemen pseudo dilampirkan pada penghujung pemilih, selepas kelas pseudo.

Dalam CSS3, anda boleh menjelaskan perbezaan ini dengan menggunakan dua titik bertindih (::) untuk mewakili elemen pseudo. Oleh itu, sintaks yang betul menjadi a:hover::before dan a:visited::before. Walau bagaimanapun, titik bertindih tunggal masih boleh diterima untuk penyemak imbas lama seperti IE8.

Sintaks ini ditentukan oleh spesifikasi CSS, yang menyatakan bahawa elemen pseudo mesti dilampirkan pada urutan akhir pemilih mudah.

Penghadan

Perhatikan bahawa pendekatan di atas mungkin tidak sesuai untuk tindakan pengguna kelas pseudo seperti ":hover" jika anda berhasrat untuk menggunakan kesan semata-mata apabila elemen pseudo itu sendiri berinteraksi dengannya. Ini pada masa ini tidak boleh dilakukan melalui mekanisme CSS standard. Dalam kes sedemikian, anda mungkin perlu menggunakan elemen anak sebenar dan bukannya elemen pseudo untuk menggunakan ":hover."

Atas ialah kandungan terperinci Cara Memohon :hover Styles to :before and :after Pseudo-elements?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!