Bagaimanakah Saya Boleh Togol Keterlihatan Div dengan HTML dan CSS Sahaja?

Togol Paparan Div pada Klik Menggunakan HTML dan CSS

Dalam artikel ini, kami berhasrat untuk menyediakan penyelesaian kepada cabaran menunjukkan dan menyembunyikan div pada klik menggunakan teknik HTML dan CSS, tanpa pergantungan pada perpustakaan JavaScript seperti jQuery.

Menggunakan Elemen HTML5

Memanfaatkan teg HTML5 perincian dan ringkasan, anda boleh mencapai div yang boleh runtuh kefungsian tanpa penggayaan atau skrip tambahan. Teg ini menawarkan sokongan asli untuk membuat bahagian yang boleh dilipat:

<details><br> <summary>Runtuhkan 1</summary><br> <p>Content 1...</p><br></details><br><details><br> <summary>Runtuhkan 2</summary><br> <p>Kandungan 2...</p><br></details><br>

CSS tambahan untuk Penggayaan

Sementara pendekatan di atas mengendalikan tingkah laku boleh lipat, anda mungkin ingin meningkatkan penampilan visual anda div. Berikut ialah contoh coretan CSS:

butiran {<br> sempadan: 1px pepejal #ccc;<br> jidar atas: 10px;<br> pelapik: 10px;<br>}<br>ringkasan {<br> latar belakang: #eee;<br> kursor: penunjuk;<br> padding: 5px;<br> paparan: blok;<br>}<br>ringkasan:tuding {<br> latar belakang: #ccc;<br>}<br>

Dengan melaksanakan teknik ini, anda boleh membuat bahagian boleh lipat dalam HTML dan CSS dengan berkesan, tanpa memerlukan jQuery atau perpustakaan JavaScript lain.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Togol Keterlihatan Div dengan HTML dan CSS Sahaja?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!