CSS -zelfstudie

CSS HOME CSS-introductie CSS-syntaxis CSS-kiezers CSS-handleiding CSS-opmerkingen CSS-kleuren CSS-achtergronden CSS-randen CSS-marges CSS-opvulling CSS Hoogte/Breedte CSS-boxmodel CSS-overzicht CSS-tekst CSS-lettertypen CSS-pictogrammen CSS-links CSS-lijsten CSS-tabellen CSS-weergave CSS Max-breedte CSS-positie CSS Z-index CSS-overloop CSS zweven CSS Inline-blok CSS uitlijnen CSS-combinaties CSS Pseudo-klasse CSS Pseudo-element CSS-dekking CSS-navigatiebalk CSS-dropdownmenu's CSS-afbeeldingengalerij CSS-afbeeldingssprites CSS Attr-kiezers CSS-formulieren CSS-tellers CSS-websitelay-out CSS-eenheden CSS-specificiteit CSS !belangrijk CSS wiskundige functies

CSS Geavanceerd

CSS afgeronde hoeken CSS-randafbeeldingen CSS-achtergronden CSS-kleuren CSS-kleurzoekwoorden CSS-verlopen CSS-schaduwen CSS-teksteffecten CSS-weblettertypen CSS 2D-transformaties CSS 3D-transformaties CSS-overgangen CSS-animaties CSS-tooltips Afbeeldingen in CSS-stijl CSS-beeldreflectie CSS-object-fit CSS-objectpositie CSS-maskering CSS-knoppen CSS-Paginering CSS Meerdere kolommen CSS-gebruikersinterface CSS-variabelen Grootte van CSS-box CSS-mediaquery's CSS MQ-voorbeelden CSS Flexbox

CSS Responsief

RWD Intro RWD-kijkpoort RWD-rasterweergave RWD-mediaquery's RWD-afbeeldingen RWD-video's RWD-frameworks RWD-sjablonen

CSS- raster

Rasterintro Rastercontainer Rasteritem

CSS SASS

SASS-zelfstudie

CSS- voorbeelden

CSS-sjablonen CSS-voorbeelden css-quiz CSS-oefeningen CSS-certificaat

CSS- referenties

CSS-referentie CSS-kiezers CSS-functies CSS Referentie Auditief CSS webveilige lettertypen CSS animeerbaar CSS-eenheden CSS PX-EM-converter CSS-kleuren CSS-kleurwaarden CSS-standaardwaarden Ondersteuning voor CSS-browser

CSS- lettertypestijl


Lettertype

De font-styleeigenschap wordt meestal gebruikt om cursieve tekst op te geven.

Deze eigenschap heeft drie waarden:

  • normaal - De tekst wordt normaal weergegeven
  • cursief - De tekst wordt cursief weergegeven
  • schuin - De tekst is "leunend" (schuin lijkt erg op cursief, maar wordt minder ondersteund)

Voorbeeld

p.normal {
  font-style: normal;
}

p.italic {
  font-style: italic;
}

p.oblique {
  font-style: oblique;
}

Lettertype dikte

De font-weighteigenschap specificeert het gewicht van een lettertype:

Voorbeeld

p.normal {
  font-weight: normal;
}

p.thick {
  font-weight: bold;
}

Lettertypevariant

De font-varianteigenschap geeft aan of een tekst al dan niet in een kleinlettertype moet worden weergegeven.

In een small-caps lettertype worden alle kleine letters omgezet in hoofdletters. De geconverteerde hoofdletters verschijnen echter in een kleinere lettergrootte dan de originele hoofdletters in de tekst.

Voorbeeld

p.normal {
  font-variant: normal;
}

p.small {
  font-variant: small-caps;
}