hanging-interpunctie

de eigenschap hanging-punctuation heeft tot doel webdesigners een fijnere controle te geven over typografie op het web.

het idee achter ophanging interpunctie is om een aantal interpunctie tekens vanaf het begin (of in mindere mate aan het einde) van tekstelementen “buiten” van het kader om de leesstroom te behouden.

in principe zou de quote, bullet of wat dan ook iets naar links (of naar rechts in rtl modus) worden verplaatst, zodat de eerste letter correct is uitgelijnd met de rest van het document.

let op: deze eigenschap is optioneel, dus browser makers kunnen het wel of niet ondersteunen.

syntaxis

hanging-punctuation: none | || last ]blockquote p { hanging-punctuation: first;}

none

geen karakter hangt. Dit is de standaardwaarde voor deze eigenschap.

first

een Beschikbaar teken aan het begin van de eerste opgemaakte regel van een element hangt.

last

een Beschikbaar teken aan het einde van de laatste opgemaakte regel van een element hangt.

force-end

een stop of komma aan het einde van een regel hangt.

de interpunctie wordt gedwongen op te hangen en wordt niet overwogen bij het meten van de lijn voor rechtvaardiging.

allow-end

een stop of komma aan het einde van een regel hangt als het niet anders past voorafgaand aan de rechtvaardiging.

de interpunctie aan het einde van de eerste regel voor niet hangen omdat het past zonder opknoping. Op de tweede lijn is er echter niet genoeg ruimte, dus het hangt wel.

beschikbare tekens

merk op dat user agents elk teken aan deze lijst mogen toevoegen. Citeren van de spec:

de UA kan eventueel andere tekens bevatten.

gerelateerde eigenschappen

• text-indent
• text-align

andere middelen

• hanging-punctuation in de spec
• hanging-punctuation met CSS door Steve Hickey

browserondersteuning

een fatsoenlijke fallback voor niet-ondersteunde browser zou zijn om een negatieve tekst-inspringing als zodanig te gebruiken:

blockquote p { text-indent: -0.5em; /* Change according to your font */}

voor opsommingen moet u er misschien voor zorgen dat de positie van opsommingen is ingesteld op outside en dat de overloop van de container niet is ingesteld op hidden.