Linjeskift - CSS-tricks | CSS Almanak 2025

CSS- line-breakejendommen definerer, hvor strengt reglerne skal håndhæves for indpakning af tekstindpakning på nye linjer, især når man arbejder med symboler og tegnsætning i kinesiske, japanske eller koreanske (CJK) -systemer. Det er inkluderet i CSS Text Module Level 3-specifikationen, som i øjeblikket er i Editor's Draft.

.element ( line-break: strict; )

Demo

Syntaks

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

Initial: auto
Gælder for: alle elementer
Arvet: ja
Beregnet værdi: som specificeret
Animationstype: diskret

Værdier

/* 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: Dette lader browseren beslutte, hvordan den implementerer linjeskift. Hver browser kan variere med hensyn til kriterier baseret på faktorer, herunder linjelængde.
loose: Dette er den letteste håndhævelse af regler for linieovertrædelse. Specifikationen citerer korte tekstlinjer, som dem vi måske ser i en avis, som et eksempel, hvor denne værdi kan bruges.
normal: Dette bryder tekstlinjer baseret på det "mest almindelige" regelsæt. (Bemærk, at der ikke er nogen definition angivet, hvad det mest almindelige regelsæt er, eller hvad det kan indeholde.)
strict: Dette håndhæver det strengeste sæt regler for linjeskift.
anywhere: Denne værdi muliggør soft wrap-muligheder, som tillader tekst at bryde i mellemrum eller tegnsætning i stedet for ordgrænsen alene. Det er ideelt til sprog, der muligvis ikke bruger mellemrum eller tegnsætning til at adskille ord. Specifikationen siger, at CSS ikke definerer soft wrap-muligheder, og denne værdi genkender og udnytter dem til at anvende linjebrydende regler. Specifikationen beskriver tekstindpakningsadfærden som det, vi typisk ser i en terminal.

Specifikationen bemærker også, at anywhereværdien tillader, at bevarede hvide mellemrum i slutningen af en linje vikles til den næste linje, når den bruges med white-spaceegenskaben indstillet til break-spaces.

Værdsadfærd på tværs af forskellige sprog

Som du måske forestiller dig, har forskellige sprog forskellige præferencer, når det kommer til, hvordan tekst brydes på nye linjer. Der er ingen standardiserede konventioner, der bruges af alle sprog. Det overlader det til browsere at finde ud af og følge de "korrekte" regler for et bestemt sprog. Men specifikationen skitserer flere krav til bestemmelse af, om linjeskift er tilladt på de forskellige line-breakstrenghedsniveauer i visse situationer. Vi præsenterer dem her.

Situation	`normal`	`loose`	`strict`
Bryder før japansk lille kana eller det forlængede lydmærke Katakana-Hiragana, dvs. karakter fra Unicode-linjens brudklasse `CJ`	❌	✅	✅
Bryder inden visse CJK bindestreglignende tegn: 〜 U + 301C, ゠ U + 30A0	❌	✅ hvis skrivesystemet er kinesisk eller japansk	Tilladt, hvis skrivesystemet er kinesisk eller japansk
Bryder inden visse CJK bindestreglignende tegn: 〜 U + 301C, ゠ U + 30A0	❌	✅ hvis det foregående tegn hører til Unicode-linjeskiftklassen `ID`(herunder når det foregående tegn behandles som på `ID`grund af`word-break: break-all)`	❌
Brud inden iterationsmærker: 々 U + 3005, 〻 U + 303B, ゝ U + 309D, ゞ U + 309E, ヽ U + 30FD, ヾ U + 30FE	❌	✅	❌
Bryder mellem uadskillelige tegn (såsom ‥ U + 2025,… U + 2026) dvs. tegn fra Unicode-linjeskiftklassen `IN`	❌	✅	❌
Bryder inden visse centrerede tegnsætningstegn: ・ U + 30FB, ： U + FF1A, ； U + FF1B, ･ U + FF65,‼ U + 203C,⁇ U + 2047,⁈ U + 2048,⁉ U + 2049,！ U + FF01,？ U + FF1F	❌	✅	❌
Pauser før suffikser: Tegn med Unicode linje bryde klasse `PO`og den østasiatiske Bredde ejendom `Ambiguous`, `Fullwidth`eller `Wide`.	❌	✅	❌
Pauser efter præfikser: Tegn med Unicode linje bryde klasse `PR`og den østasiatiske Bredde ejendom `Ambiguous`, `Fullwidth`eller `Wide`.	❌	✅	❌