Zalomenie riadku - Triky CSS | Almanach CSS 2025

Vlastnosť CSS line-breakdefinuje, ako striktne vynútiť pravidlá pre zalamovanie textu zalomením do nových riadkov, najmä pri práci so symbolmi a interpunkciami v systémoch písania čínštiny, japončiny alebo kórejčiny (CJK). Je obsiahnutý v špecifikácii textového modulu CSS úrovne 3, ktorá je momentálne v koncepte editora.

.element ( line-break: strict; )

Ukážka

Syntax

line-break: auto | loose | normal | strict | anywhere;

Počiatočné: auto
Vzťahuje sa na: všetky prvky
Zdedené: áno
Vypočítaná hodnota: podľa zadania
Typ animácie: diskrétna

Hodnoty

/* Keyword values */ line-break: auto; line-break: loose; line-break: normal; line-break: strict; line-break: anywhere; /* Global values */ line-break: inherit; line-break: initial; line-break: unset;

auto: Toto umožňuje prehliadaču rozhodnúť sa, ako implementuje zlomy riadkov. Každý prehliadač sa môže líšiť podľa svojich kritérií na základe faktorov vrátane dĺžky riadku.
loose: Toto je najľahšie vynucovanie pravidiel porušenia linky. Špecifikácia uvádza krátke riadky textu, ako napríklad tie, ktoré by sme mohli vidieť v novinách, ako príklad, kde by sa táto hodnota mohla použiť.
normal: Týmto sa zalomia riadky textu na základe „najbežnejšej“ sady pravidiel. (Upozorňujeme, že neexistuje definícia toho, čo je najbežnejšia sada pravidiel alebo čo by mohla obsahovať.)
strict: Týmto sa vynúti najprísnejšia skupina pravidiel pre zalomenie riadkov.
anywhere: Táto hodnota umožňuje možnosti mäkkého zalamovania, ktoré umožňujú prerušenie textu v medzerách alebo interpunkcii namiesto samotnej hranice slova. Je ideálny pre jazyky, ktoré na oddelenie slov nepoužívajú medzery ani interpunkciu. Špecifikácia hovorí, že CSS nedefinuje možnosti mäkkého zalamovania a táto hodnota ich rozpoznáva a využíva na použitie pravidiel na zalomenie riadkov. Špecifikácia popisuje správanie pri zalamovaní textu, ako to, čo zvyčajne vidíme v termináli.

Špecifikácia tiež poznamenáva, že anywherehodnota umožňuje, aby sa zachované biele medzery na konci riadku zalamovali do ďalšieho riadku, ak sa použije s white-spacevlastnosťou nastavenou na break-spaces.

Hodnotové správanie v rôznych jazykoch

Ako si viete predstaviť, rôzne jazyky majú rôzne preferencie, pokiaľ ide o spôsob rozbitia textu na nové riadky. Vo všetkých jazykoch neexistuje štandardizovaná konvencia. To ponecháva na prehliadačoch, aby zistili a dodržiavali „správne“ pravidlá pre konkrétny jazyk. Špecifikácia však načrtáva niekoľko požiadaviek na určenie toho, či je line-breakv určitých situáciách povolené prerušovanie vedenia na rôznych úrovniach prísnosti. Tie tu predstavíme.

Situácia	`normal`	`loose`	`strict`
Prestávky pred japonským malým kanom alebo predĺženou zvukovou značkou Katakana-Hiragana, tj. Znakom z triedy lámania riadkov Unicode `CJ`	❌	✅	✅
Konce pred určitými znakmi podobnými pomlčke CJK: 〜 U + 301C, ゠ U + 30A0	❌	✅ ak je systém písania čínsky alebo japonsky	Povolené, ak je systém písania čínsky alebo japonský
Konce pred určitými znakmi podobnými pomlčke CJK: 〜 U + 301C, ゠ U + 30A0	❌	✅ ak predchádzajúci znak patrí do triedy zalamovania riadkov Unicode `ID`(vrátane prípadov, keď sa s predchádzajúcim znakom zaobchádza ako `ID`z dôvodu`word-break: break-all)`	❌
Prestávky pred iteračnými značkami: 々 U + 3005, 〻 U + 303B, ゝ U + 309D, ゞ U + 309E, ヽ U + 30FD, ヾ U + 30FE	❌	✅	❌
Konce medzi neoddeliteľnými znakmi (napríklad ‥ U + 2025,… U + 2026), tj. Znakmi z triedy delenia riadkov Unicode `IN`	❌	✅	❌
Prestávky pred určitými centrovanými interpunkčnými znamienkami: ・ U + 30FB, ： U + FF1A, ； U + FF1B, ･ U + FF65,‼ U + 203C,⁇ U + 2047,⁈ U + 2048,⁉ U + 2049,！ U + FF01,？ U + FF1F	❌	✅	❌
Prestávky pred prípon: Znaky Unicode línie zlomu triedy `PO`a majetku východoázijské šírka `Ambiguous`, `Fullwidth`alebo `Wide`.	❌	✅	❌
Prestávky po predponami: Znaky Unicode línie zlomu triedy `PR`a majetku východoázijské šírka `Ambiguous`, `Fullwidth`alebo `Wide`.	❌	✅	❌