Den hyphensegenskap som kontroller ordeling av tekst i blokknivåelementer. Du kan forhindre at orddeling i det hele tatt skjer, tillate det eller bare tillate det når visse tegn er til stede.
Merk at det hyphenser språkfølsomt. Dens evne til å finne pausemuligheter avhenger av språket, definert i langattributtet til et foreldreelement. Ikke alle språk støttes ennå, og støtten avhenger av den spesifikke nettleseren.
Syntaks
p ( hyphens: none | manual | auto )bindestreker: ingen
Ord blir aldri bindestrek ved linjeskift, selv om tegn inne i ordet antyder hvor orddeling kan eller burde gå.
bindestreker: manuell
Ord brytes bare ved linjeskift der det er tegn i ordet som antyder muligheter for linjeskift. Det er to tegn som antyder linjeskiftmulighet:
U+2010(BINDSTREK): det "harde" bindestrektegnet indikerer en synlig strekbruddsmulighet. Selv om linjen faktisk ikke er brutt på det tidspunktet, blir bindestrek fortsatt gjengitt. Bokstavelig talt en “-”.U+00AD(SJENT): en usynlig, “myk” bindestrek. Denne karakteren gjengis ikke synlig; i stedet antyder det et sted der nettleseren kan velge å bryte ordet om nødvendig. I HTML kan du bruke-til å sette inn en myk bindestrek.
bindestreker: auto
Ord kan brytes ved passende orddeling, enten som bestemt av orddelingstegn (se ovenfor) inne i ordet eller som automatisk bestemmes av en språktilpasset orddeling for orddeling (hvis den støttes av nettleseren eller tilbys via @hyphenation-resource).
Betingede orddelingstegn i et ord, hvis de er til stede, prioriteres foran automatiske ressurser når de bestemmer orddelingspunkter i ordet.
bindestreker: alle
Foreldet, ikke bruk . Dette var bare i spesifikasjonen midlertidig for testing.
Demo
Demoen nedenfor har en haug med avsnitt, og alt er satt til hyphens: auto;å demonstrere begrepet bindestrek. Den langattributtet settes til enpå den overordnede elementet.
Nettleserstøtte
Disse nettleserstøttedataene er fra Caniuse, som har flere detaljer. Et tall indikerer at nettleseren støtter funksjonen i den versjonen og oppover.
Desktop
| Chrome | Firefox | DVS | Kant | Safari |
|---|---|---|---|---|
| 88 | 6 * | 10 * | 12 * | 5,1 * |
Mobil / nettbrett
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 4,2-4,3 * |
Safari 5+ krever -webkit-, Firefox 6+ krever -moz-, IE 10+ krever -ms-, iOS 4.2+ krever -webkit-.
Chrome <55 og Android-nettleser støtter faktisk -webkit-hyphens: none, som er standardverdien, men ingen av de andre verdiene.
I Firefox og Internet Explorer fungerer automatisk orddeling bare for noen språk (definert med langattributtet). Se dette notatet for en omfattende liste over støttede språk.
Hvis du skriver et nettbasert dokument som virkelig trenger bindestrek, kan du bruke Hyphenator.js som er et bibliotek basert på en stor ordbok som automatisk vil injisere myke bindestreker og mellomrom med null bredde i innholdet ditt.
Uten JavaScript må du stole på begge deler hyphensog word-wrap:
.hyphenate ( word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; )