Հաշվվում է տեղում

Flexbox ավազարկղ

Ուղղություն, տողադարձ, հավասարեցում և բացատ։

display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
gap: 12px;

Արտահանումն ու ներմուծումը հասանելի են մուտքից հետո։ Մտնել

Նմուշի բլոկներն անմիջապես արտացոլում են CSS-ը։

Գործիքի մասին

Արագ տեսողական հուշում flexbox-ի տարածված դասավորության վերաբերյալ։ Նմուշի բլոկներն անմիջապես արտացոլում են կողքին ցուցադրված CSS-ը․ փոխեք gap-ը և պատճենեք կանոնները նախագծում։

Ինչպես օգտվել

01
Սահմանեք տարրերի միջև միջակայքը։
02
Դիտեք, թե ինչպես են բլոկները վերադասավորվում։
03
Պատճենեք flexbox CSS-ը։

FAQ

Հաճախ տրվող հարցեր

Flex-ի ո՞ր հատկություններն են օգտագործվում

display: flex՝ row ուղղությամբ, տեղափոխմամբ, justify-content: space-between, align-items: center և սահմանված gap-ով։

Ե՞րբ է ավելի լավ grid-ը

Flexbox-ը՝ միաչափ շարքերի կամ սյունակների համար, CSS grid-ը՝ երբ անհրաժեշտ են և՛ տողեր, և՛ սյունակներ։

Ինչպես օգտվել

Հաճախ տրվող հարցեր

Նմանատիպ գործիքներ