Kā pievienot horizontālo un vertikālo robežu aizmugurējā vējā?

Ka Pievienot Horizontalo Un Vertikalo Robezu Aizmugureja Veja



Tailwind CSS nodrošina “ starpība ” lietderības klases, kas ļauj lietotājiem kontrolēt atstarpi ap elementiem. The horizontālā mala pievieno atstarpi elementa kreisajā un labajā pusē, savukārt a vertikālā mala pievieno vietu elementa augšpusē un apakšā. Tailwind piedāvā dažādas lietderības klases, lai vēlamajiem elementiem pievienotu horizontālas vai vertikālas piemales.

Šis raksts sniegs piemēru:







Kā pievienot horizontālo robežu aizmugurējā vējā?

Lai programmā Tailwind elementam pievienotu horizontālu piemali, mx- ” klase tiek lietota ar vēlamo elementu HTML programmā. Lietotāji var norādīt dažādas piemales lieluma vērtības. Šī klase pievieno piemali gar x asi (labajā un kreisajā pusē).



Sintakse



< elements klasē = 'mx- ...' > ... elements >


Šeit “mx” apzīmē “x asi” vai “horizontālo rezervi”. Noteikti aizstājiet “” ar jebkuru derīgu vērtību, piemēram, “5”, “14” utt.





Piemērs: Horizontālās piemales piemērošana HTML elementam

Šajā piemērā mēs izmantosim ' mx-10 komunālo pakalpojumu klase ar '

” elementu, lai pievienotu tam horizontālu piemali:



< ķermeni >

< div klasē = 'h-screen mx-10 bg-purple-500' >

< lpp klasē = 'text-5xl text-center' > Marža iekšā Tailwind CSS lpp >

div >

ķermeni >


Izvade


Iepriekš redzamajā izvadē ir redzama piemale konteinera kreisajā un labajā pusē. Tas norāda, ka horizontālā piemale ir veiksmīgi piemērota konteinera elementam.

Kā pievienot vertikālo robežu aizmugurējā vējā?

Lai programmā Tailwind elementam pievienotu vertikālu piemali, izmantojiet “ mana- ” lietderības klase ar konkrēto elementu HTML programmā. Šī klase pievieno malu gar y asi (augšējā un apakšējā pusē).

Sintakse

< elements klasē = 'mana-...' > ... elements >


Šeit “mans” apzīmē “y asi” vai “vertikālo malu”. Noteikti aizstājiet “” ar jebkuru derīgu vērtību, piemēram, “6”, “12” utt.

Piemērs: Vertikālās piemales piemērošana HTML elementam

Šajā piemērā mēs izmantosim ' mans-10 komunālo pakalpojumu klase ar '

” elementu, lai pievienotu tam vertikālu piemali:

< ķermeni >

< div klasē = 'h-96 my-10 bg-purple-500' >

< lpp klasē = 'text-5xl text-center' > Marža iekšā Tailwind CSS lpp >

div >

ķermeni >


Izvade


Augšējā izvade parāda rezervi konteinera augšpusē un apakšā. Tas norāda, ka vertikālā piemale ir efektīvi piemērota konteinera elementam.

Secinājums

Lai programmā Tailwind pievienotu horizontālo un vertikālo piemali, “ mx- ' un ' mana- ” lietderības klases tiek izmantotas attiecīgi ar vēlamajiem elementiem HTML programmā. Lietotāji var norādīt dažādas vērtības, lai lietotu piemales elementa kreisajā un labajā pusē vai augšpusē un apakšā. Šis raksts ir piemērs horizontālo un vertikālo piemaļu piemērošanas metodei Tailwind.