Скачать или смотреть Layout met Bootstrap 5 stap 1: kolommen maken

Eerst wordt Bootstrap gekoppeld met een CDN.
https://getbootstrap.com/docs/5.0/get...

Enkele afbeeldingen zijn breder dan de viewport. Bootstrap maakt deze 'responsive' met de class img-fluid. Dan krijgen ze een maximale breedte van 100%.
https://getbootstrap.com/docs/5.0/con...

Het grid van Bootstrap maak je door een parent element de class container te geven.
Wil je daarbinnen kolommen maken, dan zet je ze eerst samen in een element met de class row.
De children krijgen dan de class col en dan worden ze naast elkaar geplaatst waarbij de breedte gelijk zijn.
Het grid van Bootstrap heeft 12 kolommen, en je kunt elke kolom laten uitstrekken over een aantal kolommen. Wil je een kolom over 3 grid-kolommen uitstrekken, dan krijgt deze de class col-3. Een kolom met de class col-6 is dus de helft van de breedte van de container.
https://getbootstrap.com/docs/5.0/lay...

Is de som van de gebruikte kolommen minder dan 12, dan blijft er dus ruimte over. Door de row class aan te vullen met justify-content-around worden de tussenruimtes in de rij mooi verdeeld: https://getbootstrap.com/docs/5.0/uti...