Testen Sie Ihre Fähigkeiten: Fortgeschrittener HTML-Text

Ziel dieses Fähigkeitstests ist es zu beurteilen, ob Sie verstehen, wie man weniger bekannte HTML-Elemente verwendet, um fortgeschrittene semantische Merkmale zu kennzeichnen.

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 sich in einem unserer Kommunikationskanäle an uns wenden.

Aufgabe 1

In dieser Aufgabe möchten wir, dass Sie der bereitgestellten HTML-Datei wie folgt Semantik hinzufügen:

Verwandeln Sie den zweiten Absatz in ein Blockzitat und geben Sie semantisch an, dass das Zitat aus Barrierefreiheit stammt.
Kennzeichnen Sie "HTML" und "CSS" semantisch als Akronyme und geben Sie die Erweiterungen als Tooltips an.
Verwenden Sie Tief- und Hochstellen, um die richtige Semantik für die chemischen Formeln und Daten bereitzustellen und sie korrekt darzustellen.
Verknüpfen Sie semantisch maschinenlesbare Daten mit den im Text stehenden Daten.

Das fertige Beispiel sollte wie folgt 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 einem Online-Editor daran zu arbeiten.