Labo 3 - gevorderde html

Doel van de oefeningen

Een font downloaden, converten en zelf hosten.
Elementen positioneren.
Flexbox toepassen.
Het verschil begrijpen tussen hidden, display: none, visibility: hidden en visually-hidden.
Elementen visueel verbergen terwijl ze beschikbaar blijven voor hulpsoftware.
CSS transitions toepassen.
CSS nesting gebruiken voor overzichtelijke stylesheets.
CSS logical properties gebruiken.
CSS custom properties (variabelen) aanmaken, gebruiken en overschrijven.
Overlay link aanmaken en uitleggen.

Beschrijving

In dit labo oefenden we met CSS door een font zelf te hosten, elementen te positioneren en Flexbox toe te passen. Daarnaast leerden we werken met logical properties, transitions en custom properties. We maakten overlays en verborgen elementen toegankelijk voor hulpsoftware. De oefeningen werden stap voor stap opgebouwd, beginnend met een introductieoefening en daarna met kolommen en lay-out via Flexbox.

Gerelateerde Links

Reflectie

Woaw!

Ik heb aan de hand van een spelletje alle verschillen geleerd zoals space-between en columns en rows.

Aauuw!

Het juist gebruiken van flex-grow vond ik heel erg moeilijk.

Niet zeker?

Ik twijfel over wanneer ik best tewerk ga met overlay links.