Berikut ialah beberapa pilihan tajuk, memfokuskan pada persoalan menggabungkan `:after` dan `:hover`: Pilihan 1 (Terus & Ringkas): * Bagaimana untuk Mencipta Anak Panah Berlegar menggunakan :after dan :hover dalam CSS? Pilihan 2

Menggabungkan :after dengan :hover

CSS menawarkan rangkaian luas pemilih pseudo yang membolehkan penggayaan disasarkan berdasarkan pelbagai kriteria. Satu pemilih tersebut ialah :after, yang membolehkan anda menambah elemen selepas elemen yang dipilih. Satu lagi pemilih pseudo yang biasa digunakan ialah :hover, yang menyasarkan elemen apabila kursor melayang di atasnya.

Soalan yang ada cuba menggabungkan :after dengan :hover untuk mencipta bentuk anak panah yang muncul apabila elemen sama ada dipilih atau dituding ke atas. Kod asal yang disediakan dalam soalan termasuk:

<code class="css">#alertlist li.selected:after {
  ...
}</code>

yang menggunakan gaya pada elemen dengan kelas "dipilih". Untuk menambah fungsi lereng, kita perlu memasukkan peraturan :after yang serupa untuk elemen yang dilegar di atas:

<code class="css">#alertlist li.selected:after, #alertlist li:hover:after {
  ...
}</code>

Dengan menambahkan :after pada pemilih #alertlist li:hover, kami memastikan gaya digunakan pada elemen yang dipilih juga digunakan pada elemen yang dilegarkan. Kod penuh kini kelihatan seperti ini:

<code class="css">#alertlist {
  ...
}

#alertlist li {
  ...
}

#alertlist li.selected,
#alertlist li:hover {
  ...
}

#alertlist li.selected:after, #alertlist li:hover:after {
  ...
}</code>

Kini, bentuk anak panah akan muncul bukan sahaja pada elemen dengan kelas "dipilih" tetapi juga pada elemen yang sedang dituding di atas.

Atas ialah kandungan terperinci Berikut ialah beberapa pilihan tajuk, memfokuskan pada persoalan menggabungkan `:after` dan `:hover`: Pilihan 1 (Terus & Ringkas): * Bagaimana untuk Mencipta Anak Panah Berlegar menggunakan :after dan :hover dalam CSS? Pilihan 2. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!