CSS Flexbox generaator

Ehita CSS Flexbox paigutusi visuaalselt reaalajas eelvaatega. Kohanda suunda, justify-content, align-items, wrap ja gap. Kopeeri CSS-kood. Tasuta veebitööriist.

flex-direction

justify-content

align-items

flex-wrap

gap: 10px

Elemendid

Eelvaade

CSS-väljund

Viide

Mis on CSS Flexbox?

CSS Flexible Box Layout (Flexbox) on ühemõõtmeline paigutusmeetod elementide paigutamiseks ridadesse või veergudesse. Elemendid venitavad (laienevad) liigse ruumi täitmiseks või kahanevad väiksemasse ruumi mahutamiseks. See muudab paindlike, tundlike paigutusstruktuuride kujundamise lihtsaks.

Olulised Flexbox-omadused

flex-direction määrab põhitelje suuna. justify-content joondab elemente piki põhitelge. align-items joondab elemente piki risttelge. flex-wrap juhib elementide murdmist uutele ridadele. gap määrab elementidevahelise vahemaa.

Privaatsus

Kogu flexbox genereerimine toimub 100 % sinu brauseris. Ühtegi andmeid ei saadeta serverisse.

← Tagasi kõigi tööriistade juurde