U Tailwind CSS-u, ispuna se koristi za dodavanje razmaka između sadržaja određenog elementa i njegovih granica. Dodaje dodatni razmak unutar elementa. Tailwind CSS pruža skup uslužnih programa za popunjavanje i vrijednosti popunjavanja koji korisnicima dopuštaju prilagodbu razmaka željenih elemenata. Štoviše, korisnici mogu dodati podstavu na jednu stranu, kao što je vrh, dno, lijevo ili desno određenog elementa.
Ovaj će blog pokazati primjere dodavanja ispune jednoj strani elementa u Tailwind CSS-u.
Kako dodati podstavu na jednu stranu u Tailwindu?
Za dodavanje ispune jednoj strani elementa u Tailwindu, mogu se koristiti sljedeće klase uslužnih programa:
Da biste to bolje razumjeli, pogledajte dolje navedene primjere.
Primjer 1: Dodajte ispunu na vrh elementa
U ovom primjeru koristit ćemo ' pt-10 ' klasa korisnosti u ' Primjer 2: Dodajte ispunu na dno elementa U ovom primjeru koristit ćemo ' pb-10 ' razred u ' Primjer 3: Dodajte ispunu s desne strane elementa U ovom primjeru koristit ćemo ' pr-10 ' razred u ' Primjer 4: Dodajte ispunu s lijeve strane elementa U ovom primjeru koristit ćemo ' pl-10 ' razred u ' Za dodavanje ispune jednoj strani elementa u Tailwindu, mogu se koristiti različite klase korisnih programa, kao što je ' pl-
< div razreda = 'bg-ružičasta-600 pt-10 w-max' >
Padding u Stražnji vjetar CSS
div >
tijelo >
Izlaz
Gornji rezultat pokazuje da je podstava dodana na vrh spremnika.
< div razreda = 'bg-ružičasta-600 pb-10 w-max' >
Padding u Stražnji vjetar CSS
div >
tijelo >
Izlaz
Može se vidjeti da je podstava dodana na dno posude.
< div razreda = 'bg-pink-600 pr-10 w-max' >
Padding u Stražnji vjetar CSS
div >
tijelo >
Izlaz
Gornji izlaz pokazuje da je ispuna dodana s desne strane elementa spremnika.
< div razreda = 'bg-ružičasta-600 pl-10 w-max' >
Padding u Stražnji vjetar CSS
div >
tijelo >
Izlaz
Može se primijetiti da je podstava dodana lijevo od spremnika. Zaključak