< Bootsrap 4

Rácsok

Szerző: Sallai András

Copyright © Sallai András, 2020

Licenc: CC Attribution-Share Alike 4.0 International

Web: https://szit.hu

A Bootsrap4 rácsok

A Bootsrap4 rácsai flexdobozokból jönnek létre. 12 darab oszlop van meghatározva webhelyen keresztül.

Ha nincs szükséged 12 oszlopra, akkor arányosan feloszthatod a rendelkezésre álló 12 helyet.

12 oszlop:

Három rész:

Két rész:

Négy rész, forrással:

<div class="row"> <div class="col-sm-3">a</div> <div class="col-sm-3">b</div> <div class="col-sm-3">c</div> <div class="col-sm-3">d</div> </div>

Maximális méretek

Az oszlopok egy bizonyos méret alatt egymás alá kerülnek. Hogy mi legyen ez a határ a sm, md, lg, xl kulcsokkal határozhatjuk meg.

<div class="row bg-success"> <div class="col-sm-4">sm</div> <div class="col-sm-4">sm</div> <div class="col-sm-4">sm</div> </div> <div class="row bg-warning"> <div class="col-md-4">md</div> <div class="col-md-4">md</div> <div class="col-md-4">md</div> </div> <div class="row bg-info"> <div class="col-lg-4">lg</div> <div class="col-lg-4">lg</div> <div class="col-lg-4">lg</div> </div> <div class="row bg-danger"> <div class="col-xl-4">xl</div> <div class="col-xl-4">xl</div> <div class="col-xl-4">xl</div> </div>

Mivel nem lehet teljes szélességében látni a fenti beépített weblapot, itt egy közvetlen link:

https://szit.hu/m/bootstrap/grid/index_grid_max.html