Superskript-Text: Erhöhen Sie Ihren HTML-Inhalt

Einführung

Das HTML-Tag sup ermöglicht es Ihnen, Text in Superskript-Format auf einer Webseite anzuzeigen. In diesem Lab werden wir demonstrieren, wie das sup-Tag verwendet wird, um Superskript-Text zu erstellen.

Hinweis: Sie können im index.html programmieren und lernen, wie Sie HTML in Visual Studio Code schreiben. Klicken Sie bitte 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.

Dies ist ein Guided Lab, das schrittweise Anweisungen bietet, um Ihnen beim Lernen und Üben zu helfen. Befolgen Sie die Anweisungen sorgfältig, um jeden Schritt abzuschließen und praktische Erfahrungen zu sammeln. Historische Daten zeigen, dass dies ein Labor der Stufe Anfänger mit einer Abschlussquote von 100% ist. Es hat eine positive Bewertungsrate von 100% von den Lernenden erhalten.

Einrichten der HTML-Datei

Erstellen Sie eine HTML-Datei namens index.html und legen Sie die grundlegende HTML-Struktur fest.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Superscript Text</title>
  </head>
  <body></body>
</html>

Hinzufügen von Superskript-Text

Fügen Sie das sup-Tag zur HTML-Datei hinzu. Innerhalb der öffnenden und schließenden Tags des sup-Elements fügen Sie den Text hinzu, den Sie als Superskript anzeigen möchten.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Superscript Text</title>
  </head>
  <body>
    <p>
      Meine E-Mail-Adresse lautet: user123<sup>@</sup>example<sup>.</sup>com
    </p>
  </body>
</html>

Gestalten des Superskript-Textes

Sie können das sup-Tag mit CSS gestalten, um seine Schriftgröße und vertikale Ausrichtung anzupassen. Fügen Sie den folgenden CSS-Code zu Ihrer HTML-Datei hinzu:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Superscript Text</title>
    <style>
      sup {
        font-size: smaller;
        vertical-align: super;
      }
    </style>
  </head>
  <body>
    <p>
      Meine E-Mail-Adresse lautet: user123<sup>@</sup>example<sup>.</sup>com
    </p>
  </body>
</html>

Hinzufügen von mathematischer Notation

Superskript-Text ist ein wichtiger Bestandteil mathematischer Notationen. Sie können das sup-Tag verwenden, um Exponenten und Potenzen darzustellen. Fügen Sie beispielsweise folgenden Code zu Ihrer HTML-Datei hinzu:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Superscript Text</title>
    <style>
      sup {
        font-size: smaller;
        vertical-align: super;
      }
    </style>
  </head>
  <body>
    <p>Der Wert von 2<sup>3</sup> ist 8.</p>
  </body>
</html>

Zusammenfassung

In diesem Lab haben wir uns mit dem sup-Tag in HTML beschäftigt. Wir haben gelernt, wie man Superskript-Text erstellt und ihn verwendet, um Exponenten und Potenzen darzustellen. Wir haben auch gelernt, wie man das sup-Tag mit CSS gestaltet. Mit den aus diesem Lab erlernten Fähigkeiten können Sie jetzt leicht Superskript-Text zu Ihren HTML-Seiten hinzufügen.

HTML Superskript-Text