Sa Tailwind CSS, padding ay ang puwang sa pagitan ng nilalaman ng partikular na elemento at hangganan nito. Pahalang na padding ay ang puwang sa kaliwa at kanang bahagi ng elemento, samantalang patayong padding ay ang espasyo sa itaas at ibaba ng isang elemento. Nag-aalok ang Tailwind ng iba't ibang klase ng utility upang magdagdag ng pahalang o patayong padding sa mga gustong elemento.
Ang artikulong ito ay maglalarawan:
Paano Magdagdag ng Horizontal Padding sa Tailwind?
Upang magdagdag ng pahalang na padding sa isang elemento sa Tailwind, ang klase na 'px-
Syntax
< elemento klase = 'px-0 ...' > ... elemento >
Dito kinakatawan ng 'px' ang 'x-axis' o 'horizontal padding'.
Halimbawa: Paglalapat ng Horizontal Padding sa isang HTML Element
Sa halimbawang ito, gagamitin namin ang ' px-20 ' utility class na may ' Upang magdagdag ng vertical padding sa isang elemento sa Tailwind, gamitin ang “ py- Syntax Halimbawa: Paglalapat ng Vertical Padding sa isang HTML Element Sa halimbawang ito, gagamitin namin ang ' py-20 ' utility class na may ' Upang idagdag ang pahalang at patayong padding sa Tailwind, ang ' px-
< katawan >
< div klase = 'bg-pink-600 px-20 w-max' >
Padding sa Tailwind CSS
div >
katawan >
Output 
Ipinapakita ng output sa itaas ang padding sa kaliwa at kanang bahagi ng lalagyan. Ito ay nagpapahiwatig na ang pahalang na padding ay matagumpay na nailapat sa elemento ng lalagyan. Paano Magdagdag ng Vertical Padding sa Tailwind?
Dito kinakatawan ng 'py' ang 'y-axis' o 'vertical padding'.
< div klase = 'bg-pink-600 py-20 w-max' >
Padding sa Tailwind CSS
div >
katawan >
Output 
Ipinapakita ng output sa itaas ang padding sa itaas at ibabang gilid ng lalagyan. Ito ay nagpapahiwatig na ang vertical padding ay epektibong inilapat sa elemento ng lalagyan. Konklusyon