Cette leçon contient 17 diapositives, avec quiz interactif et diapositives de texte.
La durée de la leçon est: 60 min
Éléments de cette leçon
CSS Grid
Slide 1 - Diapositive
Leerdoelen
Je past CSS Grid toe om een gestructureerde lay-out te creëren.
Je past de CSS Grid-eigenschappen correct toe om elementen binnen een grid te positioneren.
Je gebruikt grid-rijen en -kolommen om de opmaak van een tijdschriftartikel effectief te beheren.
Slide 2 - Diapositive
Wat is een grid eigenlijk?
Slide 3 - Carte mentale
Slide 4 - Diapositive
Slide 5 - Diapositive
Een grid is een soort raster dat je kunt gebruiken om dingen netjes te organiseren. Bijvoorbeeld op een pagina. Je kunt het zien als een onzichtbaar bord met vakjes.
Binnen die vakjes kun je verschillende elementen plaatsen.
Slide 6 - Diapositive
De kast is je grid container.
De vakken in de kast zijn de rijen en kolommen.
De spullen die je in de vakken zet zijn de grid items.
Slide 7 - Diapositive
De kast is je grid container.
De vakken in de kast zijn de rijen en kolommen.
De spullen die je in de vakken zet zijn de grid items.
Slide 8 - Diapositive
De kast is je grid container.
De vakken in de kast zijn de rijen en kolommen.
De spullen die je in de vakken zet zijn de grid items.
Slide 9 - Diapositive
De kast is je grid container.
De vakken in de kast zijn de rijen en kolommen.
De spullen die je in de vakken zet zijn de grid items.
Slide 10 - Diapositive
De verticale lijnen zijn de kolommen.
columns binnen CSS
Slide 11 - Diapositive
De horizontale lijnen zijn de rijen.
rows binnen CSS
Slide 12 - Diapositive
De ruimte tussen de columns en de rows noemen we gaps.
Waar kennen we gap nog meer van bij CSS?
Slide 13 - Diapositive
De lijnen tussen de verschillende columns noem je column lines.
De lijnen tussen de rows noem je row lines.
Bij het plaatsen van items verwijs je naar de lines en dus niet het vakje
La durée de la leçon est: 60 min
