In Tailwind CSS, a margine viene utilizzato per controllare la spaziatura attorno all'elemento specifico. Aggiunge spazio tra l'elemento applicato e gli elementi circostanti. Tailwind CSS fornisce una serie di utilità di margine e valori di margine che consentono agli utenti di personalizzare la spaziatura attorno agli elementi desiderati. Inoltre, gli utenti possono aggiungere un margine a un singolo lato, come la parte superiore, inferiore, sinistra o destra di un particolare elemento.
Questo blog illustrerà esempi per aggiungere margine a un singolo lato di un elemento in Tailwind CSS.
Come aggiungere margine a un singolo lato in Tailwind?
Per aggiungere margine a un singolo lato di un elemento in Tailwind, è possibile utilizzare le seguenti classi di utilità:
Per capirlo meglio, passa attraverso gli esempi forniti di seguito.
Esempio 1: aggiungi margine alla parte superiore di un elemento
In questo esempio, useremo il ' mt-14 ” classe di utilità nella “ Produzione Esempio 2: aggiungi margine alla parte inferiore di un elemento In questo esempio, useremo il ' MB-14 ” classe nel “ Esempio 3: Aggiungi margine a sinistra di un elemento In questo esempio, useremo il ' ml-14 ” classe nel “ Esempio 4: aggiungi margine a destra di un elemento In questo esempio, useremo il ' signor-14 ” classe nel “ Per aggiungere margine a un singolo lato di un elemento in Tailwind, è possibile utilizzare varie classi di utilità, come ' ml-
< div classe = 'h-96 mt-14 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Qui:
L'output precedente mostra che il margine è stato aggiunto alla parte superiore del contenitore.
< div classe = 'h-96 mb-14 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Produzione 
Si può vedere che il margine è stato aggiunto al fondo del contenitore.
< div classe = 'h-96 ml-14 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Produzione 
L'output precedente mostra che il margine è stato aggiunto a sinistra dell'elemento contenitore.
< div classe = 'h-96 mr-14 bg-viola-500' >
< P classe = 'centro testo testo-5xl' > Margine In CSS vento in coda P >
div >
corpo >
Produzione 
Come puoi vedere, il margine è stato aggiunto in modo efficiente alla destra del contenitore. Conclusione