Können Sie Divs nur mit CSS ein- und ausblenden?

Divs nur mit CSS anzeigen und ausblenden

Möchten Sie Divs basierend auf Benutzereingaben anzeigen oder ausblenden, aber nur mit CSS? Lassen Sie uns herausfinden, wie Sie dies erreichen können, ohne auf JavaScript angewiesen zu sein.

Problemstellung:

Der Benutzer möchte Divs beim Klicken nur mit CSS ein- und ausblenden. Obwohl derzeit jQuery verwendet wird, bevorzugen sie eine barrierefreie Lösung, die auch bei deaktiviertem JavaScript funktioniert.

Nur-CSS-Lösung: Checkbox-Hack

Für eine reine CSS-Lösung: Betrachten Sie den Checkbox-Hack. Bei dieser Methode wird ein Kontrollkästchen verwendet, um die Anzeige von Divs zu steuern. Wenn das Kontrollkästchen aktiviert ist, wird ein Satz von Stilen angewendet, und wenn es deaktiviert ist, wird ein anderer Satz verwendet. Der Pseudoselektor :checked wird verwendet, um zwischen diesen Zuständen zu unterscheiden.

Um das Kontrollkästchen aus ästhetischen Gründen auszublenden, hängen Sie es an ein Etikett an.

Demo und Ressourcen

• [Dabblet Demo](http://dabblet.com/gist/1506530)
• [CSS-Tricks-Artikel zum Checkbox-Hack](http://css-tricks.com/the-checkbox-hack/)

Das obige ist der detaillierte Inhalt vonKönnen Sie Divs nur mit CSS ein- und ausblenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!