Tailwind CSS pruža ' margina ” klase korisnih programa koje korisnicima omogućuju kontrolu razmaka oko elemenata. The horizontalna margina dodaje prostor na lijevu i desnu stranu elementa, dok a okomita margina dodaje prostor na vrh i dno elementa. Tailwind nudi različite klase korisnosti za dodavanje vodoravnih ili okomitih margina željenim elementima.
Ovaj članak će ilustrirati sljedeće:
Kako dodati vodoravnu marginu u Tailwind?
Za dodavanje horizontalne margine elementu u Tailwindu, ' mx-
Sintaksa
< element razreda = 'mx-
Ovdje 'mx' predstavlja 'x-os' ili 'horizontalnu marginu'. Svakako zamijenite “
Primjer: Primjena vodoravne margine na HTML element
U ovom primjeru koristit ćemo ' mx-10 ' klasa korisnosti s ' Za dodavanje okomite margine elementu u Tailwindu, koristite ' moj- Sintaksa Primjer: Primjena okomite margine na HTML element U ovom primjeru koristit ćemo ' moj-10 ' klasa korisnosti s ' Za dodavanje vodoravne i okomite margine u Tailwind, ' mx-
< tijelo >
< div razreda = 'h-screen mx-10 bg-ljubičasta-500' >
< str razreda = 'text-5xl text-center' > Margina u Stražnji vjetar CSS str >
div >
tijelo >
Izlaz
Gornji izlaz prikazuje marginu s lijeve i desne strane spremnika. To znači da je vodoravna margina uspješno primijenjena na element spremnika. Kako dodati okomitu marginu u Tailwind?
Ovdje 'moj' predstavlja 'os y' ili 'okomitu marginu'. Obavezno zamijenite “
< div razreda = 'h-96 moj-10 bg-ljubičasta-500' >
< str razreda = 'text-5xl text-center' > Margina u Stražnji vjetar CSS str >
div >
tijelo >
Izlaz
Gornji izlaz prikazuje marginu gornje i donje strane spremnika. Ovo označava da je okomita margina učinkovito primijenjena na element spremnika. Zaključak