Kā lietot pārtraukuma punktus un multivides vaicājumus ar “attaisnojošu saturu” programmā Tailwind?

” elements, lai mainītu tā vienumu horizontālo izlīdzinājumu vidējā un lielā ekrānā:

< ķermeni >

< div klasē = 'flex justify-start md:justify-beween lg:justify-end gap-3 m-3 bg-teal-700' >
< div klasē = 'bg-yellow-400 w-24 h-12' > 1 < / div >
< div klasē = 'bg-yellow-400 w-24 h-12' > 2 < / div >
< div klasē = 'bg-yellow-400 w-24 h-12' > 3 < / div >

< / div >

< / ķermeni >

Šeit:

• 'attaisnot-sākt' klase izlīdzina elastīgos vienumus konteinera galvenās ass sākumā.
• “md:attaisnot-starp” klase sadala elastīgos vienumus pa konteinera galveno asi ar vienādu atstarpi starp tiem uz vidēja izmēra ekrāna.
• “lg:justify-end” klase izlīdzina elastīgos vienumus konteinera galvenās ass galā uz liela ekrāna.

Izvade

---

---

Iepriekš redzamā izvade parāda, ka elastīgo vienumu horizontālais izlīdzinājums mainās, mainoties ekrāna izmēram. Tas norāda, ka norādītie pārtraukuma punkti un multivides vaicājumi ir efektīvi lietoti, izmantojot utilītu “justify-content”.

Secinājums

Lai lietotu pārtraukumpunktus un multivides vaicājumus ar “justify-content” utilītprogrammām programmā Tailwind, definējiet vēlamo vērtību “attaisnot-” utilīta dažādiem ekrāna izmēriem, izmantojot ' md ” vai “ lg ” pārtraukuma punkti. Lai veiktu verifikāciju, mainiet tīmekļa lapas ekrāna izmēru un nodrošiniet izmaiņas. Šajā rakstā ir parādīts piemērs, kā lietot vēlamos pārtraukumpunktus un multivides vaicājumus Tailwind utilītprogrammām “attaisnot saturu”.