hanging-punctuation CSS property
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more support for this feature? Tell us why.
Die hanging-punctuation CSS Eigenschaft legt fest, ob ein Satzzeichen am Anfang oder Ende einer Textzeile hängen soll. Hängende Satzzeichen können außerhalb der Linienbox platziert werden.
Syntax
/* Keyword values */
hanging-punctuation: none;
hanging-punctuation: first;
hanging-punctuation: last;
hanging-punctuation: allow-end;
/* Two keywords */
hanging-punctuation: first allow-end;
hanging-punctuation: first last;
hanging-punctuation: last allow-end;
/* Three keywords */
hanging-punctuation: first allow-end last;
/* Global values */
hanging-punctuation: inherit;
hanging-punctuation: initial;
hanging-punctuation: revert;
hanging-punctuation: revert-layer;
hanging-punctuation: unset;
Die hanging-punctuation-Eigenschaft kann mit einem, zwei oder drei durch Leerzeichen getrennten Werten angegeben werden.
Werte
none-
Kein Zeichen hängt.
first-
Eine öffnende Klammer oder ein Anführungszeichen am Anfang der ersten formatierten Zeile eines Elements hängt. Dies gilt für:
last-
Eine schließende Klammer oder ein Anführungszeichen am Ende der letzten formatierten Zeile eines Elements hängt. Dies gilt für:
allow-end-
Ein Punkt oder Komma am Ende einer Zeile hängt, wenn es nicht anderweitig vor der Rechtfertigung passt.
Punkte und Kommas, die hängen dürfen, umfassen:
U+002C, KOMMAU+002E, PUNKTU+060C, ARABISCHES KOMMAU+06D4, ARABISCHER PUNKTU+3001, IDEOGRAPHISCHES KOMMAU+3002, IDEOGRAPHISCHER PUNKTU+FF0C, VOLLBREITES KOMMAU+FF0E, VOLLBREITER PUNKTU+FE50, KLEINES KOMMAU+FE51, KLEINES IDEOGRAPHISCHES KOMMAU+FE52, KLEINER PUNKTU+FF61, HALBBREITER IDEOGRAPHISCHER PUNKTU+FF64, HALBBREITES IDEOGRAPHISCHES KOMMA
Benutzeragenten können zusätzliche Zeichen einbeziehen.
Formale Definition
| Anfangswert | none |
|---|---|
| Anwendbar auf | alle Elemente |
| Vererbt | Ja |
| Berechneter Wert | wie angegeben |
| Animationstyp | diskret |
Formaler Syntax
hanging-punctuation =
none |
[ first || [ force-end | allow-end ] || last ]
Beispiele
Öffnende und schließende Anführungszeichen hängen lassen
HTML
<p>
«For a moment, nothing happened. Then, after a second or so, nothing continued
to happen.»
</p>
<p class="hanging">
«For a moment, nothing happened. Then, after a second or so, nothing continued
to happen.»
</p>
<p class="hanging right">
«For a moment, nothing happened. Then, after a second or so, nothing continued
to happen.»
</p>
CSS
p {
width: 15em;
border: 1px solid #cccccc;
font-size: 2rem;
font-style: italic;
margin: 1em;
}
p.hanging {
hanging-punctuation: first last;
}
p.right {
text-align: right;
}
Ergebnis
Spezifikationen
| Spezifikation |
|---|
| CSS Text Module Level 3 # hanging-punctuation-property |