Websiteentwicklung: CSS: Schriftweite
Mit der Eigenschaft font-stretch kann das typische Aspektverhältnis Breite zu Höhe von Glyphen beeinflußt werden.
Als einfachste Näherung kann man sich vorstellen, dass ausgehend von einem normalen Aspektverhältnis jede Glyphe in
horizontaler Richtung skaliert wird, also gestaucht oder gestreckt.
Bei den tatsächlichen Schrifttypen werden allerdings die Glyphen gegenüber dieser einfachen Veranschaulichung hinsichtlich der Lesbarkeit optimiert sein.
Diese Eigenschaft ist in CSS 2.0 verfügbar, aufgrund mangelnder Implementierungen wird sie jedoch in CSS 2.1 nicht erwähnt, und wird erst wieder in einem Arbeitsentwurf für das Font-Modul von CSS3 aufgeführt.
Mögliche Werte sind:
- 'inherit' - geerbt
- 'narrower' stärker zusammengedrängt als geerbt
- 'wider' stärker geweitet als geerbt
- 'normal' für normale Textausdehnung (Initialwert)
- 'condensed' für zusammengedrängt
- 'semi-condensed' für halb zusammengedrängt
- 'extra-condensed' für stark zusammengedrängt
- 'ultra-condensed'für extrastark zusammengedrängt
- 'expanded' für geweitet
- 'semi-expanded' für halb geweitet
- 'extra-expanded' für stark geweitet
- 'ultra-expanded' für extrastark geweitet
Die Reihenfolge ist von am stärksten zusammengedrängt bis zum am stärksten geweitet: 'ultra-condensed', 'extra-condensed', 'condensed', 'semi-condensed', 'normal', 'semi-expanded', 'expanded', 'extra-expanded', 'ultra-expanded'. 'narrower' und 'wider' setzen die Eigenschaft dann vom geerbten Wert auf den nächsten engeren oder weiteren in der Liste, ohne aber über die Liste hinauszureichen, 'narrower' als 'ultra-condensed' ist also wieder dasselbe 'ultra-condensed' und entsprechend 'wider' als 'ultra-expanded' ist also wieder dasselbe 'ultra-expanded'.
Die Eigenschaft wird vererbt und ist anwendbar für alle Elemente bei visuellen Medien.
Beispiel
p {
font-stretch: expanded
}
Dieser Text wird gedehnt dargestellt.
Dieser Text wird extrastark zusammengedrängt dargestellt.