CSS-Eigenschaft hanging-punctuation

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.

Anfangswert	none
Gilt für	Alle Elemente.
Vererbt	Ja.
Animierbar	Nein.
Version	CSS3
DOM-Syntax	object.style.hangingPunctuation = "last";

Syntax

Syntax der CSS-Eigenschaft hanging-punctuation

css

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

html

<!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>

Try it Yourself »

Ergebnis

CSS hanging-punctuation Property

Werte

Wert	Beschreibung
none	Hängende Satzzeichen werden nicht angewendet. Dies ist der Standardwert dieser Eigenschaft.
first	Ein Satzzeichen wird außerhalb des Anfangsrands der ersten Zeile hängen.
last	Ein Satzzeichen wird außerhalb des Endrands der letzten Zeile hängen.
allow-end	Ein Satzzeichen wird außerhalb des Endrands einer Zeile hängen, wenn es vor der Ausrichtung sonst nicht passt.
force-end	Ein 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

What does the hanging punctuation property in CSS do?

Determines whether elements can overshadow one another.Allows a punctuation mark to be positioned outside the line box edge.Generalizes the idea of inserting content before or after an element's content.Positions the punctuation marks in the center of the line box.

CSS-Eigenschaft hanging-punctuation ​

Syntax ​

Beispiel für die Eigenschaft hanging-punctuation: ​

Ergebnis ​