Opt-in für den optimierten Textumbruch für mehr Schönheit statt Schnelligkeit
Ab Chrome 117 können Sie eine neue Funktion für den Textumbruch verwenden – text-wrap: pretty
ab CSS-Textebene 4.
p {
text-wrap: pretty;
}
Typografische Witwen und Waisenkinder sind einzelne Wörter, die am Ende eines Absatzes oder Textblocks stehen. Witwen sind Wörter, die ganz oben in einem Textblock stehen, und Waisen am Ende eines Textblocks. Sie stören uns beim Überfliegen des Textes, sodass der Inhalt schwerer zu lesen ist. Einige Designer vermeiden dies um jeden Preis und unternehmen große Anstrengungen, um dies zu verhindern.
Ab Chrome 117 können Waisenkinder mit einer CSS-Zeile vermieden werden: text-wrap: pretty
.
Die Funktion sorgt nicht nur dafür, dass Absätze nicht mit einem einzelnen Wort enden, sondern passt auch die Verwendung von Bindestrichen an, wenn aufeinanderfolgende Zeilen mit Bindestrich am Ende eines Absatzes stehen, oder vorherige Zeilen werden angepasst, um Platz zu schaffen. Außerdem wird die Textausrichtung entsprechend angepasst. text-wrap: pretty
dient allgemein dazu, den Zeilenumbruch und die Textumbrüche zu verbessern. Der Schwerpunkt liegt derzeit auf Waisen.
In Zukunft bietet text-wrap: pretty
möglicherweise weitere Verbesserungen.
![Ein Vergleich eines Absatzes mit Waisenkindern und einem Absatz ohne Waisenkinder, jeweils mit dem Logo „Schlecht“ oder „Gut“.](https://developer.chrome.com/static/blog/css-text-wrap-pretty/image/a-comparison-a-paragraph-8806ede4d3829.png?authuser=6&hl=de)
Die Funktion text-wrap: balance
verhindert keine Verwaisung, sorgt aber dafür, dass der Text so umbrochen wird, dass ein harmonischer Textblock entsteht. Ich persönlich verwende balance
für Überschriften und pretty
für Absätze.
Wenn Sie sich für die Details des Algorithmus, der zur Bestimmung der optimalen Anzahl von Zeilen verwendet wird, oder für Leistungsaspekte interessieren, finden Sie hier einen Link zum Designdokument, das vom Entwickler des Features erstellt wurde, hinter der Funktion Koji Ishii.
Wenn du weitere Verbesserungen oder Vorschläge zur Verbesserung deiner Richtlinien hast, freuen wir uns, sie zu hören. Melden Sie ein Problem mit den Details und Beispielen für zulässige und fehlerhafte Zeilenumbrüche im Chromium-Tracker für Programmfehler. Wir melden uns dann bei Ihnen.