De hyphens
ejendom kontrol orddeling af tekst i blok niveau elementer. Du kan overhovedet forhindre orddeling, tillade det eller kun tillade det, når bestemte tegn er til stede.
Bemærk, at det hyphens
er sprogfølsomt. Dens evne til at finde pausemuligheder afhænger af det sprog, der er defineret i lang
attributten til et overordnet element. Ikke alle sprog understøttes endnu, og support afhænger af den specifikke browser.
Syntaks
p ( hyphens: none | manual | auto )
bindestreger: ingen
Ord er ikke bindestreg ved linjeskift, selvom tegn inde i ordet antyder, hvor orddeling kan eller skal gå.
bindestreger: manuel
Ord brydes kun ved linjeskift, hvor der er tegn inde i ordet, der antyder linjeskiftmuligheder. Der er to tegn, der foreslår linjeskiftmulighed:
U+2010
(BINDSTREF): det “hårde” bindestregtegn angiver en synlig mulighed for linjeskift. Selvom linjen ikke faktisk er brudt på det tidspunkt, gengives bindestrek stadig. Bogstaveligt talt en “-”.U+00AD
(SHY): en usynlig, "blød" bindestreg. Denne karakter gengives ikke synligt; i stedet foreslår det et sted, hvor browseren muligvis vælger at bryde ordet, hvis det er nødvendigt. I HTML kan du bruge-
til at indsætte en blød bindestreg.
bindestreger: auto
Ord kan brydes ved passende orddeling, enten som bestemt af orddelingstegn (se ovenfor) inde i ordet eller som automatisk bestemt af en sproglig passende orddeling (hvis det understøttes af browseren eller leveres via @hyphenation-resource
).
Betingede orddelestreger inde i et ord, hvis de er til stede, prioriteres over automatiske ressourcer, når de bestemmer orddelingspunkter i ordet.
bindestreger: alle
Forældet, må ikke bruges . Dette var kun i specifikationen midlertidigt til test.
Demo
Demoen nedenfor har en masse afsnit, og alt er indstillet til hyphens: auto;
at demonstrere begrebet orddeling. Den lang
egenskab er indstillet til en
på det overordnede element.
Tjek denne pen!
Browsersupport
Denne browsersupportdata er fra Caniuse, som har flere detaljer. Et tal angiver, at browseren understøtter funktionen i den version og opefter.
Desktop
Chrome | Firefox | IE | Edge | Safari |
---|---|---|---|---|
88 | 6 * | 10 * | 12 * | 5.1 * |
Mobil / tablet
Android Chrome | Android Firefox | Android | iOS Safari |
---|---|---|---|
88 | 85 | 81 | 4,2-4,3 * |
Safari 5+ kræver -webkit-
, Firefox 6+ kræver -moz-
, IE 10+ kræver -ms-
, iOS 4.2+ kræver -webkit-
.
Chrome <55 og Android-browser understøtter faktisk -webkit-hyphens: none
, hvilket er standardværdien, men ingen af de andre værdier.
I Firefox og Internet Explorer fungerer automatisk orddeling kun for nogle sprog (defineret med lang
attributten). Se denne note for en omfattende liste over understøttede sprog.
Hvis du skriver et webbaseret dokument, der virkelig har brug for bindestreg, kan du bruge Hyphenator.js, som er et bibliotek baseret på en stor ordbog, der automatisk indsprøjter bløde bindestreger og mellemrum i nul bredde i dit indhold.
Uden JavaScript skal du stole på begge hyphens
og word-wrap
:
.hyphenate ( word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; )