Jak přidat výplň na jednu stranu ve službě Tailwind?

Jak Pridat Vypln Na Jednu Stranu Ve Sluzbe Tailwind



V CSS Tailwind se odsazení používá k přidání mezery mezi obsah konkrétního prvku a jeho okraje. Přidá další mezery uvnitř prvku. Tailwind CSS poskytuje sadu obslužných programů pro odsazení a hodnot odsazení, které uživatelům umožňují přizpůsobit rozmístění požadovaných prvků. Kromě toho mohou uživatelé přidat výplň na jednu stranu, například na horní, spodní, levou nebo pravou stranu určitého prvku.

Tento blog předvede příklady přidání odsazení na jednu stranu prvku v Tailwind CSS.







Jak přidat výplň na jednu stranu ve službě Tailwind?

Chcete-li přidat odsazení na jednu stranu prvku v Tailwindu, lze použít následující třídy obslužných programů:



Abyste tomu lépe porozuměli, podívejte se na níže uvedené příklady.



Příklad 1: Přidejte výplň na horní část prvku





V tomto příkladu použijeme „ bod-10 'užitná třída v '

” pro přidání 10 jednotek odsazení na jeho horní část:

< tělo >

< div třída = 'bg-růžová-600 pt-10 w-max' >
Vycpávka v Tailwind CSS
div >

tělo >


Výstup




Výše uvedený výstup ukazuje, že výplň byla přidána do horní části kontejneru.

Příklad 2: Přidejte výplň do spodní části prvku

V tomto příkladu použijeme „ pb-10 “ třídy v “

” pro přidání 10 jednotek výplně na jeho spodní část:

< tělo >

< div třída = 'bg-růžová-600 pb-10 w-max' >
Vycpávka v Tailwind CSS
div >

tělo >


Výstup


Je vidět, že na dno nádoby byla přidána výplň.

Příklad 3: Přidejte výplň napravo od prvku

V tomto příkladu použijeme „ pr-10 “ třídy v “

” prvek pro přidání 10 jednotek výplně vpravo:

< tělo >

< div třída = 'bg-růžová-600 pr-10 w-max' >
Vycpávka v Tailwind CSS
div >

tělo >


Výstup


Výše uvedený výstup ukazuje, že výplň byla přidána napravo od prvku kontejneru.

Příklad 4: Přidejte výplň vlevo od prvku

V tomto příkladu použijeme „ pl-10 “ třídy v “

” prvek pro přidání 10 jednotek výplně vlevo:

< tělo >

< div třída = 'bg-růžová-600 pl-10 w-max' >
Vycpávka v Tailwind CSS
div >

tělo >


Výstup


Lze pozorovat, že vycpávka byla přidána na levou stranu nádoby.

Závěr

Chcete-li přidat odsazení na jednu stranu prvku v Tailwindu, lze použít různé třídy obslužných programů, například „ pl- “, “ pr- “, “ pt- ', a ' pb- “. Tyto třídy přidávají odsazení na levou, pravou, horní a spodní stranu konkrétního prvku. Uživatelé mohou zadat různé hodnoty velikosti výplně. Tento blog předvedl příklady přidání odsazení na jednu stranu prvku v Tailwind CSS.