De hanging-punctuationeiendom skal gi webdesignere en finere kornet kontroll over typografi på web.
Ideen bak hengende tegnsetting er å sette noen tegnsettingstegn fra start (eller i mindre grad på slutten) av tekstelementer "utenfor" boksen for å bevare lesestrømmen.
I utgangspunktet vil det flytte sitatet, punktet eller hva som helst til venstre (eller høyre i rtlmodus) slik at første bokstav er riktig justert med resten av dokumentet.
Vær oppmerksom på at dette hotellet er valgfritt, så nettleserprodusenter støtter det eller ikke.
Syntaks
hanging-punctuation: none | ( first || ( force-end | allow-end ) || last ) blockquote p ( hanging-punctuation: first; )none
Ingen karakter henger. Dette er standardverdien for denne egenskapen.
first
Et tilgjengelig tegn begynner på den første formaterte linjen til et element.
last
Et tilgjengelig tegn på slutten av den siste formaterte linjen til et element henger.
force-end
Et stopp eller komma på slutten av en linje henger.
Tegnsettingene blir tvunget til å henge og blir ikke vurdert når man måler linjen for rettferdiggjørelse.
allow-end
Et stopp eller komma på slutten av en linje henger hvis det ellers ikke passer før begrunnelse.
Tegnsettingen på slutten av første linje for henger ikke fordi den passer uten å henge. På den andre linjen er det imidlertid ikke nok plass slik at den henger.
Tilgjengelige tegn
| Kode | Karakter | Navn |
|---|---|---|
U+002C | , | KOMMA |
U+002E | . | FULL STOPP |
U+060C | ، | ARABISK KOMMA |
U+06D4 | ۔ | ARABISK FULL STOPP |
U+3001 | 、 | IDEOGRAFISK KOMMA |
U+3002 | 。 | IDEOGRAFISK STOPP |
U+FF0C | , | FULLBREDD KOMMA |
U+FF0E | ． | FULLBredde FULL STOPP |
U+FE50 | ﹐ | LITEN KOMMA |
U+FE51 | ﹑ | LITEN IDEOGRAFISK KOMMA |
U+FE52 | ﹒ | LITEN FULL STOPP |
U+FF61 | ｡ | HALVBREIDE IDEOGRAFISK FULL STOPP |
U+FF64 | ､ | HALVBREIDE IDEOGRAFISK KOMMA |
Merk at brukeragenter har lov til å legge til et hvilket som helst tegn i denne listen. Sitere spesifikasjonen:
UA kan inneholde andre tegn etter behov.
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 |
|---|---|---|---|---|
| Nei | Nei | Nei | Nei | 10 |
Mobil / nettbrett
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| Nei | Nei | Nei | 10.0-10.2 |
En anstendig tilbakemelding for ikke-støttet nettleser ville være å bruke en negativ tekstinnrykk som følger:
blockquote p ( text-indent: -0.5em; /* Change according to your font */ )For punktlister kan det være lurt å sørge for at kulenes posisjon er satt til outsideog at beholderens overløp ikke er satt til hidden.