font
font:
De font property is een CSS property die de stijl, grootte, gewicht en lettertype van de tekst van een element bepaalt. Het wordt meestal gebruikt om de tekst op een webpagina aan te passen.
Voorbeelden:
- font: normal;
- font: italic;
- font: oblique;
- font: bold;
- font: bolder;
- font: lighter;
Toepassing:
<DIV style="font: lighter;">
Voorbeeldtekst
</DIV>
font-family
font-family:
De font-family property is een CSS property die het lettertype bepaalt van een element. De font-family property geeft de naam van het lettertype aan dat gebruikt moet worden in de stijl van het element.
Voorbeelden:
- font-family: Arial;
- font-family: Helvetica;
- font-family: Times New Roman;
- font-family: Courier New;
Toepassing:
<DIV style="font-family: Courier New;">
Voorbeeldtekst
</DIV>
font-feature-settings
font-feature-settings:
De font-feature-settings property geeft gebruikers de mogelijkheid om te kiezen welke lettertypesetting-functies ze willen gebruiken voor een bepaalde tekst. Hiermee kan een tekst worden aangepast aan specifieke behoeften. Bijvoorbeeld, het kunnen inschakelen van lettertype-ligatures, kleine hoofdletters, figure-sets, contextuele alternatieven, etc.
Voorbeelden:
- font-feature-settings: "liga", "calt", "kern";
- font-feature-settings: "dlig", "smcp";
Toepassing:
<DIV style="font-feature-settings: "dlig", "smcp";">
Voorbeeldtekst
</DIV>
font-kerning
font-kerning:
De font-kerning property stelt de gebruiker in staat om de ruimte tussen twee karakters te regelen die naast elkaar staan. Op deze manier kunnen kleine aanpassingen worden gedaan aan het lettertype om de leesbaarheid te verbeteren.
Voorbeelden:
- font-kerning: normal;
- font-kerning: auto;
Toepassing:
<DIV style="font-kerning: auto;">
Voorbeeldtekst
</DIV>
font-size
font-size:
De font-size property stelt de gebruiker in staat om de grootte van de tekst aan te passen. De waarde kan worden vastgelegd in verschillende eenheden, waaronder pixels, pt, em, etc.
Voorbeelden:
- font-size: 12px;
- font-size: 1.2em;
Toepassing:
<DIV style="font-size: 1.2em;">
Voorbeeldtekst
</DIV>
font-size-adjust
font-size-adjust:
De font-size-adjust eigenschap stelt u in staan om de verschillen tussen verschillende lettertypen te verminderen. Met deze eigenschap kun je de afmetingen van de lettertypen aanpassen om een uniforme ervaring te creëren, ongeacht welk lettertype wordt weergegeven.
Voorbeelden:
- font-size-adjust: normal;
- font-size-adjust: 0.5;
- font-size-adjust: 0.7;
- font-size-adjust: 0.9;
Toepassing:
<DIV style="font-size-adjust: 0.9;">
Voorbeeldtekst
</DIV>
font-stretch
font-stretch:
De font-stretch eigenschap stelt u in staat om de breedte van de lettertypen te veranderen. Hiermee kunt u de breedte van de lettertypen aanpassen om verschillen tussen verschillende lettertypen te verminderen.
Voorbeelden:
- font-stretch: ultra-condensed;
- font-stretch: extra-condensed;
- font-stretch: condensed;
- font-stretch: semi-condensed;
- font-stretch: normal;
- font-stretch: semi-expanded;
- font-stretch: expanded;
- font-stretch: extra-expanded;
- font-stretch: ultra-expanded;
Toepassing:
<DIV style="font-stretch: ultra-expanded;">
Voorbeeldtekst
</DIV>
font-style
font-style:
De font-style eigenschap stelt u in staat om de stijl van de lettertypen te veranderen. Met deze eigenschap kunt u de stijl van de lettertypen aanpassen naar normaal, oblique of italic.
Voorbeelden:
- font-style: normal;
- font-style: italic;
- font-style: oblique;
Toepassing:
<DIV style="font-style: oblique;">
Voorbeeldtekst
</DIV>
font-variant
font-variant:
De font-variant property stelt de lettervarianten in van het geselecteerde lettertype.
Voorbeelden:
- font-variant: normal;
- font-variant: small-caps;
Toepassing:
<DIV style="font-variant: small-caps;">
Voorbeeldtekst
</DIV>
font-variant-ligatures
font-variant-ligatures:
De font-variant-ligatures property stelt de letterverbindingen in die gebruikt worden bij het weergeven van teksten.
Voorbeelden:
- font-variant-ligatures: normal;
- font-variant-ligatures: none;
Toepassing:
<DIV style="font-variant-ligatures: none;">
Voorbeeldtekst
</DIV>
font-weight
font-weight:
De font-weight property stelt de dikte (gewicht) in van het geselecteerde lettertype.
Voorbeelden:
- font-weight: normal;
- font-weight: bold;
- font-weight: bolder;
- font-weight: lighter;
Toepassing:
<DIV style="font-weight: lighter;">
Voorbeeldtekst
</DIV>
all
all:
De property all is een shorthand-property waarmee je alle andere eigenschappen van de elementen in de selectie kunt aanpassen. Alle eigenschappen die gereset worden door browsers, zoals margin, border, padding, font-style, font-variant en letter-spacing, worden geregeld door deze property.
Voorbeelden:
- all: initial;
- all: unset;
- all: inherit;
- all: revert;
Toepassing:
<DIV style="all: revert;">
Voorbeeldtekst
</DIV>
line-height
line-height:
De line-height property is een eigenschap die gebruikt wordt om de verticale ruimte tussen regels te bepalen. De line-height wordt gespecificeerd in pixels of eenheden. Als de waarde 1.2 is, zal de verticale ruimte tussen regels 20% groter zijn dan de standaard fontgrootte; Als de waarde 2 is, zal de verticale ruimte tussen regels twee keer zo groot zijn als de standaard fontgrootte.
Voorbeelden:
- line-height: 1.2;
- line-height: 15px;
- line-height: -10px;
Toepassing:
<DIV style="line-height: -10px;">
Voorbeeldtekst
</DIV>