Hulpprogramma's voor lay-out
Voor een snellere mobielvriendelijke en responsieve ontwikkeling bevat Bootstrap tientallen hulpprogrammaklassen voor het weergeven, verbergen, uitlijnen en plaatsen van inhoud.
Gebruik onze weergavehulpprogramma's voor het snel wisselen van algemene waarden van de display
eigenschap. Combineer het met ons rastersysteem, inhoud of componenten om ze in specifieke viewports te tonen of te verbergen.
Bootstrap 4 is gebouwd met flexbox, maar niet elk element display
is gewijzigd, display: flex
omdat dit veel onnodige overschrijvingen zou toevoegen en onverwacht het belangrijkste browsergedrag zou veranderen. De meeste van onze componenten zijn gebouwd met flexbox ingeschakeld.
Als je display: flex
iets aan een element moet toevoegen, doe dat dan met .d-flex
of een van de responsieve varianten (bijv. .d-sm-flex
). Je hebt deze klasse of display
waarde nodig om het gebruik van onze extra flexbox-hulpprogramma's voor dimensionering, uitlijning, spatiëring en meer toe te staan.
Gebruik de margin
en padding
spacing-hulpprogramma's om te bepalen hoe elementen en componenten worden verdeeld en gedimensioneerd. Bootstrap 4 bevat een schaal met vijf niveaus voor spatiëringshulpprogramma's, gebaseerd op een 1rem
standaardwaardevariabele $spacer
. Kies waarden voor alle viewports (bijv. .mr-3
voor margin-right: 1rem
), of kies responsieve varianten om specifieke viewports te targeten (bijv. .mr-md-3
om te margin-right: 1rem
beginnen bij het md
breekpunt).
Als omschakelen display
niet nodig is, kunt u visibility
van een element wisselen met onze zichtbaarheidshulpprogramma's . Onzichtbare elementen hebben nog steeds invloed op de lay-out van de pagina, maar worden visueel verborgen voor bezoekers.