<u> HTML unabgegrenztes Annotations- (Unterstreichungs-) Element
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Das <u> HTML-Element repräsentiert einen Bereich von Inline-Text, der so dargestellt werden sollte, dass er auf eine nicht-textliche Annotation hinweist. Standardmäßig wird dies als durchgehende Linie dargestellt, aber durch CSS kann dies geändert werden.
Warnung:
Dieses Element wurde früher in älteren Versionen von HTML als "Underline" (Unterstreichung) Element bezeichnet und wird manchmal immer noch fälschlicherweise dafür verwendet. Um Text zu unterstreichen, sollten Sie stattdessen einen Stil anwenden, der die CSS-Eigenschaft text-decoration mit dem Wert underline verwendet.
Probieren Sie es aus
<p>
You could use this element to highlight <u>speling</u> mistakes, so the writer
can <u>corect</u> them.
</p>
p {
margin: 0;
}
u {
text-decoration: red wavy underline;
}
Sehen Sie im Abschnitt Verwendungsnotizen nach weiteren Details, wann <u> angemessen verwendet wird und wann nicht.
Attribute
Dieses Element enthält nur die globalen Attribute.
Verwendungsnotizen
Zusammen mit anderen reinen Stil-Elementen wurde das ursprüngliche HTML Unterstreichungs- (<u>) Element in HTML 4 abgeschafft; jedoch wurde <u> in HTML 5 mit einer neuen, semantischen Bedeutung wieder eingeführt: um Text zu kennzeichnen, der irgendeine Form von nicht-textlicher Annotation hat.
Hinweis:
Vermeiden Sie die Verwendung des <u> Elements mit seinem Standardstil (unterstrichener Text) in einer Art und Weise, die mit einem Hyperlink – der standardmäßig ebenfalls unterstrichen ist – verwechselt werden könnte.
Anwendungsfälle
Gültige Anwendungsfälle für das <u> Element umfassen das Markieren von Rechtschreibfehlern, das Anbringen eines Proper Name Marks, um Eigennamen in chinesischem Text zu kennzeichnen, und andere Formen von Annotation.
Sie sollten <u> nicht verwenden, um Text aus Präsentationsgründen zu unterstreichen oder um Buchtitel zu kennzeichnen.
Andere zu berücksichtigende Elemente
In den meisten Fällen sollten Sie ein anderes Element als <u> verwenden, wie:
<em>um einen betonten Akzent zu markieren<b>um Aufmerksamkeit auf Text zu lenken<mark>um Schlüsselwörter oder -ausdrücke zu markieren<strong>um anzuzeigen, dass Text stark wichtig ist<cite>um Buchtitel oder andere Publikationen zu kennzeichnen<i>um technische Begriffe, Transliteration, Gedanken oder Namen von Schiffen in westlichen Texten zu kennzeichnen
Um textuelle Anmerkungen (im Gegensatz zu den nicht-textlichen Anmerkungen, die mit <u> erstellt werden) bereitzustellen, verwenden Sie das <ruby> Element.
Um eine unterstrichene Darstellung ohne semantische Bedeutung zu erreichen, verwenden Sie die CSS-Eigenschaft text-decoration mit dem Wert underline.
Beispiele
Hervorheben eines Rechtschreibfehlers
Dieses Beispiel verwendet das <u> Element und etwas CSS, um einen Absatz anzuzeigen, der einen falsch geschriebenen Fehler enthält, wobei der Fehler im rot gewellten Unterstreichungsstil dargestellt wird, der zu diesem Zweck ziemlich häufig verwendet wird.
HTML
<p>This paragraph includes a <u class="spelling">wrnogly</u> spelled word.</p>
Im HTML sehen wir die Verwendung von <u> mit einer Klasse, spelling, die verwendet wird, um die falsche Schreibweise des Wortes "wrongly" anzuzeigen.
CSS
u.spelling {
text-decoration: red wavy underline;
}
Dieses CSS zeigt an, dass, wenn das <u> Element mit der Klasse spelling gestylt ist, es eine rote, gewellte Unterstreichung unter seinem Text haben sollte. Dies ist eine übliche Gestaltung für Rechtschreibfehler. Eine andere gebräuchliche Stilart kann mit red dashed underline dargestellt werden.
Ergebnis
Das Ergebnis sollte jedem, der eine der bekannteren heute verfügbaren Textverarbeitungsprogramme verwendet hat, bekannt vorkommen.
Vermeidung von <u>
Meistens möchten Sie <u> eigentlich nicht verwenden. Hier sind einige Beispiele, die zeigen, was Sie stattdessen in mehreren Fällen tun sollten.
Nicht-semantische Unterstreichungen
Um Text zu unterstreichen, ohne irgendeine semantische Bedeutung zu implizieren, verwenden Sie ein <span> Element mit der CSS-Eigenschaft text-decoration auf "underline" gesetzt, wie unten gezeigt.
HTML
<span class="underline">Today's Special</span>
<br />
Chicken Noodle Soup With Carrots
CSS
.underline {
text-decoration: underline;
}
Ergebnis
Präsentation eines Buchtitels
Buchtitel sollten mit dem <cite> Element und nicht mit <u> oder sogar <i> dargestellt werden.
Verwendung des cite-Elements
<p>The class read <cite>Moby-Dick</cite> in the first term.</p>
Stil des cite-Elements
Die Standardgestaltung für das <cite> Element rendert den Text kursiv. Sie können das mit CSS überschreiben:
<p>The class read <cite>Moby-Dick</cite> in the first term.</p>
cite {
font-style: normal;
text-decoration: underline;
}
Technische Übersicht
| Inhaltskategorien | Flussinhalt, Phraseninhalt, greifbarer Inhalt. |
|---|---|
| Erlaubter Inhalt | Phraseninhalt. |
| Tag-Auslassung | Keine, sowohl das Start- als auch das End-Tag sind obligatorisch. |
| Erlaubte Eltern | Jedes Element, das Phraseninhalt akzeptiert. |
| Implizierte ARIA-Rolle |
generic
|
| Erlaubte ARIA-Rollen | Beliebig |
| DOM-Interface | [`HTMLElement`](/de/docs/Web/API/HTMLElement) |
Spezifikationen
| Spezifikation |
|---|
| HTML # the-u-element |