Testen Sie Ihre Fähigkeiten: Fortgeschrittener HTML-Text
Ziel dieses Fähigkeitstests ist es, zu beurteilen, ob Sie wissen, wie Sie weniger bekannte HTML-Elemente zur Markierung fortgeschrittener semantischer Funktionen verwenden.
Hinweis: Sie können Lösungen in den interaktiven Editoren auf dieser Seite oder in einem Online-Editor wie CodePen, JSFiddle oder Glitch ausprobieren.
Wenn Sie nicht weiterkommen, können Sie uns in einem unserer Kommunikationskanäle erreichen.
Aufgabe 1
In dieser Aufgabe möchten wir, dass Sie die bereitgestellten Tiere und deren Definitionen in eine Definitionsliste umwandeln.
Das fertige Beispiel sollte so aussehen:
Versuchen Sie, den Live-Code unten zu aktualisieren, um das fertige Beispiel nachzubilden:
Laden Sie den Startpunkt für diese Aufgabe herunter, um in Ihrem eigenen Editor oder in einem Online-Editor zu arbeiten.
Aufgabe 2
In dieser Aufgabe möchten wir, dass Sie der bereitgestellten HTML-Datei einige Semantik hinzufügen wie folgt:
- Verwandeln Sie den zweiten Absatz in ein Blockzitat und kennzeichnen Sie semantisch, dass das Zitat aus Accessibility stammt.
- Markieren Sie "HTML" und "CSS" semantisch als Akronyme und fügen Sie Erweiterungen als Tooltips hinzu.
- Verwenden Sie Tief- und Hochstellung, um den chemischen Formeln und Daten die korrekte Semantik zu verleihen und sie korrekt anzuzeigen.
- Verknüpfen Sie maschinenlesbare Daten semantisch mit den Daten im Text.
Das fertige Beispiel sollte so aussehen:
Versuchen Sie, den Live-Code unten zu aktualisieren, um das fertige Beispiel nachzubilden:
Laden Sie den Startpunkt für diese Aufgabe herunter, um in Ihrem eigenen Editor oder in einem Online-Editor zu arbeiten.