Abkürzungen in HTML erstellen | HTML-Tutorials

Einführung

Das HTML <abbr>-Tag wird verwendet, um eine Abkürzung oder ein Akronym zu definieren.

In diesem Lab lernst du, wie du das HTML <abbr>-Tag verwendest, um anzuzeigen, welche Abkürzungen und Akronyme im Text deiner Webseite auftauchen.

Hinweis: Du kannst im index.html programmieren und lernen, wie du HTML in Visual Studio Code schreibst. Klicke im unteren rechten Eck auf 'Go Live', um den Webdienst auf Port 8080 auszuführen. Anschließend kannst du die Registerkarte Web 8080 aktualisieren, um die Webseite anzuschauen.

Skills Graph

Füge den Überschrift hinzu

Zunächst erstelle ein HTML-Dokument namens index.html und deklariere den Dokutyp.

Füge der index.html-Datei die Überschrift hinzu.

    <h1>Creating Abbreviations in HTML</h1>

Füge Inhalt hinzu

Füge einigen Textinhalt zur HTML-Datei hinzu.

    <p>Suppose we have an abbreviation like Mr. or Mrs. which are very common in our day to day life or we can have technical abbreviations like HTML, CSS or HTTP.</p>

Verwende das `<abbr>`-Tag

Verwende das <abbr>-Tag, um die Abkürzung zu definieren, und füge das title-Attribut hinzu, um eine vollständige Erklärung der Abkürzung bereitzustellen.

    <p>Suppose we have an abbreviation like <abbr title="Mister">Mr.</abbr> or <abbr title="Misses">Mrs.</abbr> which are very common in our day to day life or we can have technical abbreviations like <abbr title="HyperText Markup Language">HTML</abbr>, <abbr title="Cascading Style Sheets">CSS</abbr> or <abbr title="Hypertext Transfer Protocol">HTTP</abbr>.</p>

Füge Styles zum `<abbr>`-Tag hinzu

Füge Styles zum <abbr>-Tag hinzu, um zu ändern, wie die Abkürzung auf der Webseite angezeigt wird. Beispielsweise können wir einen gestrichelten Unterstrich hinzufügen, um eine Abkürzung anzuzeigen.

    <style>
        abbr {
            text-decoration: underline dotted;
        }
    </style>

Speichere deine Datei und öffne sie in einem Webbrowser, um das Ergebnis zu sehen.

Zusammenfassung

In diesem Lab haben Sie gelernt, wie Sie Abkürzungen und Akronyme in Webseiten mit dem HTML <abbr>-Tag erstellen. Sie haben auch gelernt, wie Sie Styles für einzelne <abbr>-Tags hinzufügen und Styles auf mehrere Tags mit dem globalen class-Attribut anwenden.

HTML Abkürzungstag