W3docs
de
Anmelden

CSS-Eigenschaft hanging-punctuation

Use the CSS hanging-punctuation property to define whether a punctuation mark should hang at the start or at the end of a text’s line. Definition of the property, values and examples.

Die Eigenschaft hanging-punctuation legt fest, ob ein Satzzeichen am Anfang oder am Ende einer Textzeile „hängen“ soll.

Hängende Satzzeichen werden bei vollständig ausgerichtetem Text verwendet und steuern die Ausrichtung aller Zeilen in einem Textabsatz, wenn sie am Zeilenende verwendet werden.

Anfangswertnone
Gilt fürAlle Elemente.
VererbtJa.
AnimierbarNein.
VersionCSS3
DOM-Syntaxobject.style.hangingPunctuation = "last";

Syntax

Syntax der CSS-Eigenschaft hanging-punctuation

hanging-punctuation: none | first | last | allow-end | force-end | initial | inherit;

Beispiel für die Eigenschaft hanging-punctuation:

Beispiel der CSS-Eigenschaft hanging-punctuation mit dem Wert first

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      blockquote {
        font-style: normal;
        font-size: 25px;
        width: 20em;
        border-left: 1px solid #000;
        padding: 3rem 0;
        hanging-punctuation: first;
      }
    </style>
  </head>
  <body>
    <h2>Hanging-punctuation property example</h2>
    <blockquote>"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s".</blockquote>
  </body>
</html>
Probier es selbst »

Ergebnis

CSS hanging-punctuation Property

Werte

WertBeschreibung
noneHängende Satzzeichen werden nicht angewendet. Dies ist der Standardwert dieser Eigenschaft.
firstEin Satzzeichen wird außerhalb des Anfangsrands der ersten Zeile hängen.
lastEin Satzzeichen wird außerhalb des Endrands der letzten Zeile hängen.
allow-endEin Satzzeichen wird außerhalb des Endrands einer Zeile hängen, wenn es vor der Ausrichtung sonst nicht passt.
force-endEin Satzzeichen wird außerhalb des Endrands aller Zeilen hängen. Wenn für diese Zeile Blocksatz aktiviert ist, wird das Satzzeichen dadurch zum Hängen gezwungen.

Practice

Übung

What does the hanging punctuation property in CSS do?