This tutorial is from open-source community. Access the source code
💡 Dieser Artikel wurde von AI-Assistenten übersetzt. Um die englische Version anzuzeigen, können Sie hier klicken
In diesem Lab werden wir die :empty-Pseudo-Klasse in CSS erkunden, mit der wir Elemente auswählen und verstecken können, die keinen Inhalt haben. Indem wir diese Technik anwenden, können wir die Gesamtgestaltung und Lesbarkeit unserer Webseiten verbessern, indem wir Unordnung und Leerzeichen entfernen. Durch eine Reihe von Übungen werden wir lernen, wie wir die :empty-Pseudo-Klasse effektiv nutzen, um leere Elemente zu verstecken und saubere und polierte Webseiten zu erstellen.
index.html und style.css wurden bereits in der VM bereitgestellt.
Um Elemente ohne Inhalt zu verstecken, verwenden Sie die :empty-Pseudo-Klasse. Beispielsweise, wenn Sie folgenden HTML-Code haben:
<p>Lorem ipsum dolor sit amet. <button></button></p>Sie können folgenden CSS-Code verwenden, um das Element button ohne Inhalt zu verstecken:
p:empty {
display: none;
}Bitte klicken Sie auf 'Go Live' in der unteren rechten Ecke, um den Webdienst auf Port 8080 auszuführen. Anschließend können Sie die Registerkarte Web 8080 aktualisieren, um die Webseite anzuschauen.
Herzlichen Glückwunsch! Sie haben das Lab "Leere Elemente verstecken" abgeschlossen. Sie können in LabEx weitere Labs absolvieren, um Ihre Fähigkeiten zu verbessern.
