Gjenerator i Flexbox

Krijoni një kontejner flex dhe elementet e tij me kontrolle vizuale, shikoni strukturën duke reaguar drejtpërdrejt dhe kopjoni CSS-në me një klikim.

Parazgjedhjet
Kontejneri
Drejtimi
Wrap
Justify content
Align items
Elementet
Elementi 1
Align self
CSS
Rregulloni kontejnerin dhe elementet për të formësuar strukturën tuaj.

Struktura juaj ndërtohet drejtpërdrejt në shfletuesin tuaj. Asgjë që vendosni këtu nuk ngarkohet në BroBroGo.

Pyetje të shpeshta

Cili është ndryshimi midis justify-content dhe align-items?

Justify-content hapësiron elementet përgjatë aksit kryesor — drejtimi në të cilin rrjedh rreshti ose kolona — ndërsa align-items i pozicionon ato përgjatë aksit tjetër. Ndryshoni drejtimin nga rresht në kolonë dhe dy akset ndërrohen, kështu që justify-content fillon të funksionojë nga lart poshtë dhe align-items nga e majta në të djathtë.

Si funksionojnë kontrollet për çdo element?

Zgjidhni një element sipas numrit të tij, pastaj vendosni se sa rritet (grow) për të mbushur hapësirën e lirë, sa zvogëlohet (shrink) kur hapësira është e ngushtë, madhësinë e tij fillestare (basis) dhe rreshtimin e tij në aksin tërthor (align-self). Order e lëviz një element më herët ose më vonë në ekran pa prekur HTML-në. Vetëm elementet që ndryshoni marrin rregullin e tyre në CSS.

Kur kanë rëndësi wrap dhe align-content?

Me mbështjelljen (wrap) të çaktivizuar, çdo element detyrohet të qëndrojë në një rresht të vetëm dhe mund të ngushtohet. Aktivizojeni dhe elementet që nuk nxënë më bien në rreshtin tjetër — atëherë merr kontrollin align-content, duke hapësiruar rreshtat si grup. Gap përcakton hapësirën midis elementeve dhe midis rreshtave, pa përdorur margin.

Gjenerator i CSS Cubic BezierTërhiqni dy dorezat për të formësuar një kurbë zbutjeje, shikoni një pikë duke lëvizur përgjatë saj kundrejt një lëvizjeje të qëndrueshme dhe kopjoni vlerën cubic-bezier().Gjenerator i Border RadiusRrumbullakosni çdo kënd me rrëshqitës, krijoni forma organike blob me modalitetin eliptik dhe kopjoni CSS-në menjëherë.Gjenerator i Box ShadowTërhiqni rrëshqitësit për të formësuar një box-shadow, mbivendosni shtresa për thellësi dhe kopjoni CSS-në e përfunduar menjëherë.Gjenerator i gradienteveNdërtoni një gradient linear, radial ose konik, shtoni ndalesa ngjyrash dhe vendosni drejtimin, pastaj kopjoni CSS-në me një klikim.Gjenerator i CSS GridVendosni kolonat dhe rreshtat tuaj, tërhiqni përgjatë qelizave për të vendosur elemente dhe kopjoni CSS-në e rrjetës me HTML-në përkatëse me një klikim.Kalkulator i CSS clamp()Vendosni një madhësi për ekranet e vegjël dhe të mëdhenj dhe merrni një vlerë fluide clamp() që shkallëzohet pa probleme në mes — për madhësitë e fonteve, padding, margin ose gap.Konvertues i ngjyraveKonvertoni ngjyrat midis HEX, RGB, HSL, HSV, CMYK dhe LAB — ndryshoni çdo fushë dhe të tjerat përditësohen gjatë shkrimit.