Cuprins:

Cum folosești Flexbox și grid?
Cum folosești Flexbox și grid?

Video: Cum folosești Flexbox și grid?

Video: Cum folosești Flexbox și grid?
Video: Flexbox or grid - How to decide? 2024, Noiembrie
Anonim

Am aranjat elementele sub formă de rânduri și coloane pe web încă de la noi folosit tabele pentru aranjare. Ambii flexbox și grid se bazează pe acest concept. Flexbox este cel mai bun pentru aranjarea elementelor fie pe un singur rând, fie pe o singură coloană. Grilă este cel mai bun pentru aranjarea elementelor pe mai multe rânduri și coloane.

Ulterior, se poate întreba, de asemenea, puteți folosi Flexbox și grid împreună?

În mare parte nu. Grilă este mult mai nou decât Flexbox și are un pic mai puțin suport pentru browser. ei poate sa muncă împreună : A grilă articol poate sa fi a flexbox recipient. A contracta articol poate sa fi a grilă recipient.

De asemenea, este grila CSS mai bună decât Flexbox? Grile CSS sunt pentru machete 2D. Funcționează atât cu rânduri, cât și cu coloane. Flexbox lucrări mai bine într-o singură dimensiune (fie rânduri SAU coloane). Va fi Mai mult economisește timp și util dacă le folosești pe ambele în același timp.

În consecință, ce este Flexbox grid?

Flexbox este realizat pentru machete unidimensionale și Grilă este realizat pentru machete bidimensionale. Aceasta înseamnă că, dacă așezați articole într-o singură direcție (de exemplu trei butoane în interiorul unui antet), atunci ar trebui să utilizați Flexbox : Vă va oferi mai multă flexibilitate decât CSS Grilă.

Când nu ar trebui să utilizați Flexbox?

Când să nu folosiți flexbox

  1. Nu utilizați flexbox pentru aspectul paginii. Un sistem de grilă de bază care utilizează procente, lățimi maxime și interogări media este o abordare mult mai sigură pentru crearea unor aspecte de pagină receptive.
  2. Nu adăugați display:flex; la fiecare container div.
  3. Nu utilizați flexbox dacă aveți mult trafic de la IE8 și IE9.

Recomandat: