CSS text-underline-position-Eigenschaft

Die Eigenschaft text-underline-position legt die Position der Unterstreichung für das Element fest, für das der Wert „underline“ der text-decoration-Eigenschaft angegeben ist.

Die Eigenschaft text-underline-position wird von allen modernen Browsern weitgehend unterstützt.

Anfangswert	auto
Gilt für	Alle Elemente.
Vererbbar	Ja.
Animierbar	Nein.
Version	CSS3
DOM-Syntax	object.style.textUnderlinePosition = "under";

Hinweis: In JavaScript werden CSS-Eigenschaften mit Bindestrichen in camelCase umgewandelt (z. B. wird text-underline-position zu textUnderlinePosition).

Syntax

CSS text-underline-position Werte

css

text-underline-position: auto | [ under || left || right || above || below ] | initial | inherit;

Beispiel für die text-underline-position-Eigenschaft:

CSS text-underline-position Codebeispiel

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      p {
        text-decoration: underline;
        text-underline-position: under;
      }
    </style>
  </head>
  <body>
    <h2>Text underline-position property example</h2>
    <p>Lorem Ipsum is simply dummy text...</p>
  </body>
</html>

Try it Yourself »

Ergebnis

CSS text-underline-position under value

Beispiel für die text-underline-position-Eigenschaft mit dem Wert „under“:

CSS text-underline-position unterer Wert Beispiel

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      p {
        text-decoration: underline;
        text-underline-position: under;
        text-decoration-color: #1c87c9;
        font-size: 25px;
      }
    </style>
  </head>
  <body>
    <h2>Text underline-position property example</h2>
    <p>Lorem Ipsum is simply dummy text...</p>
  </body>
</html>

Try it Yourself »

Werte

Wert	Beschreibung
auto	Der Browser verwendet seinen eigenen Algorithmus, um die Linie an oder unter der alphabetischen Grundlinie zu platzieren.
under	Erzwingt die Platzierung der Unterstreichung unter dem Textinhalt des Elements.
left	Erzwingt die Platzierung der Unterstreichung auf der linken Seite des Textes im vertikalen Schreibmodus.
right	Erzwingt die Platzierung der Unterstreichung auf der rechten Seite des Textes im vertikalen Schreibmodus.
above	Erzwingt die Platzierung der Linie über dem Text.
below	Erzwingt die Platzierung der Linie unter dem Text.
initial	Legt fest, dass die Eigenschaft ihren Standardwert verwendet.
inherit	Erbt die Eigenschaft von ihrem übergeordneten Element.

Praxis

Welche Aussage ist falsch bezüglich der text-underline-position-Eigenschaft?

Sie wird von allen Browsern unterstützt.Der Wert „below“ erzwingt, dass die Linie unter dem Text platziert wird.Der Wert „auto-pos“ funktioniert genauso wie der auto-Wert.

CSS text-underline-position-Eigenschaft ​

Syntax ​

Beispiel für die text-underline-position-Eigenschaft: ​

Ergebnis ​

Beispiel für die text-underline-position-Eigenschaft mit dem Wert „under“: ​

Werte ​