widows
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die widows-Eigenschaft von CSS legt die minimale Anzahl von Zeilen in einem Blockcontainer fest, die oben auf einer Seite, Region oder Spalte angezeigt werden müssen.
In der Typografie ist eine Widow die letzte Zeile eines Absatzes, die allein oben auf einer Seite erscheint. (Der Absatz wird von einer vorherigen Seite fortgesetzt.)
Syntax
css
/* <integer> values */
widows: 2;
widows: 3;
/* Global values */
widows: inherit;
widows: initial;
widows: revert;
widows: revert-layer;
widows: unset;
Werte
<integer>-
Die minimale Anzahl von Zeilen, die nach einem Fragmentierungsumbruch am Anfang eines neuen Fragmentes allein stehen können. Der Wert muss positiv sein.
Formale Definition
| Anfangswert | 2 |
|---|---|
| Anwendbar auf | Blockcontainerelemente |
| Vererbt | Ja |
| Berechneter Wert | wie angegeben |
| Animationstyp | by computed value type |
Formale Syntax
widows =
<integer [1,∞]>
Beispiele
Steuerung von Spalten-Widows
HTML
html
<div>
<p>This is the first paragraph containing some text.</p>
<p>
This is the second paragraph containing some more text than the first one.
It is used to demonstrate how widows work.
</p>
<p>
This is the third paragraph. It has a little bit more text than the first
one.
</p>
</div>
CSS
css
div {
background-color: #8cffa0;
columns: 3;
widows: 2;
}
p {
background-color: #8ca0ff;
}
p:first-child {
margin-top: 0;
}
Ergebnis
Spezifikationen
| Specification |
|---|
| CSS Fragmentation Module Level 3 # widows-orphans |
| CSS Multi-column Layout Module Level 1 # filling-columns |