Kā pievienot polsterējumu vienai pusei aizmugurējā vējā?

Ka Pievienot Polsterejumu Vienai Pusei Aizmugureja Veja



Pakalpojumā Tailwind CSS polsterējums tiek izmantots, lai pievienotu atstarpi starp konkrētā elementa saturu un tā apmalēm. Tas pievieno papildu atstarpi elementa iekšpusē. Tailwind CSS nodrošina polsterējuma utilītu un aizpildīšanas vērtību kopu, kas lietotājiem ļauj pielāgot vēlamo elementu atstarpi. Turklāt lietotāji var pievienot polsterējumu vienai konkrēta elementa pusei, piemēram, augšpusē, apakšā, kreisajā vai labajā pusē.

Šajā emuārā tiks parādīti piemēri, kā pievienot polsterējumu vienai elementa pusei programmā Tailwind CSS.







Kā pievienot polsterējumu vienai pusei aizmugurējā vējā?

Lai pievienotu polsterējumu vienai elementa pusei programmā Tailwind, var izmantot šādas lietderības klases:



Lai to labāk izprastu, skatiet tālāk sniegtos piemērus.



1. piemērs: pievienojiet polsterējumu elementa augšpusē





Šajā piemērā mēs izmantosim ' pt-10 komunālo pakalpojumu klasē

” elements, lai tā augšdaļā pievienotu 10 polsterējuma vienības:

< ķermeni >

< div klasē = 'bg-rozā-600 pt-10 w-max' >
Polsterējums iekšā Tailwind CSS
div >

ķermeni >


Izvade




Iepriekš redzamā izvade parāda, ka polsterējums ir pievienots konteinera augšpusē.

2. piemērs. Pievienojiet polsterējumu elementa apakšai

Šajā piemērā mēs izmantosim ' pb-10 ” klasē “

” elements, lai tā apakšā pievienotu 10 polsterējuma vienības:

< ķermeni >

< div klasē = 'bg-rozā-600 pb-10 w-max' >
Polsterējums iekšā Tailwind CSS
div >

ķermeni >


Izvade


Var redzēt, ka konteinera apakšai ir pievienots polsterējums.

3. piemērs. Pievienojiet polsterējumu pa labi no elementa

Šajā piemērā mēs izmantosim ' pr-10 ” klasē “

” elements, lai pievienotu 10 polsterējuma vienības tā labajā pusē:

< ķermeni >

< div klasē = 'bg-pink-600 pr-10 w-max' >
Polsterējums iekšā Tailwind CSS
div >

ķermeni >


Izvade


Iepriekš redzamā izvade parāda, ka polsterējums ir pievienots konteinera elementa labajā pusē.

4. piemērs. Pievienojiet polsterējumu elementa kreisajā pusē

Šajā piemērā mēs izmantosim ' pl-10 ” klasē “

” elementu, lai pievienotu 10 polsterējuma vienības tā kreisajā pusē:

< ķermeni >

< div klasē = 'bg-rozā-600 pl-10 w-max' >
Polsterējums iekšā Tailwind CSS
div >

ķermeni >


Izvade


Var novērot, ka polsterējums ir pievienots konteinera kreisajā pusē.

Secinājums

Lai pievienotu polsterējumu vienai elementa pusei programmā Tailwind, var izmantot dažādas lietderības klases, piemēram, “ pl- ”, “ pr- ”, “ pt- ', un ' pb- ”. Šīs klases pievieno polsterējumu konkrētā elementa kreisajā, labajā, augšējā un apakšējā pusē. Lietotāji var norādīt dažādas polsterējuma izmēra vērtības. Šajā emuārā ir parādīti piemēri, kā Tailwind CSS elementa vienai pusei pievienot polsterējumu.