Liigu sisuni

CSS Grid generaator

Ehita CSS Grid paigutusi visuaalselt reaalajas eelvaatega. Määra veerud, read, vahemikud ja joondus. Kopeeri CSS-kood. Tasuta veebitööriist.

Eelvaade

CSS-väljund
 

Mis on CSS Grid?

CSS Grid Layout on kahemõõtmeline paigutussüsteem, mis võimaldab luua keerukaid ruudustikupõhiseid paigutusi. Erinevalt Flexboxist, mis on ühemõõtmeline, saab Grid käsitleda nii veerge kui ridu samaaegselt, mis teeb selle ideaalseks leheküljepaigutuste jaoks.

Grid-mallid

grid-template-columns ja grid-template-rows määravad grid-veergude ja -ridade rajasuurused. Kasuta 1fr võrdsete osade jaoks, auto sisupõhise suuruse jaoks või fikseeritud väärtusi nagu 200px. Funktsioon repeat() lihtsustab korduvaid mustreid.

Privaatsus

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