V Tailwind CSS, oblazinjenje je prostor med vsebino določenega elementa in njegovo mejo. Vodoravno oblazinjenje je prostor na levi in desni strani elementa, medtem ko je navpično oblazinjenje je prostor na vrhu in dnu elementa. Tailwind ponuja različne razrede uporabnosti za dodajanje vodoravnih ali navpičnih oblazinjenj želenim elementom.
Ta članek bo ponazoril:
Kako dodati vodoravno oblazinjenje v Tailwind?
Za dodajanje vodoravnega oblazinjenja elementu v Tailwindu se z želenim elementom v programu HTML uporabi razred »px-
Sintaksa
< element razred = 'px-0 ...' > ... element >
Tu 'px' predstavlja 'os x' ali 'vodoravno oblazinjenje'.
Primer: uporaba vodoravnega oblazinjenja za element HTML
V tem primeru bomo uporabili » px-20 ' razred uporabnosti z ' Če želite elementu v Tailwindu dodati navpično oblazinjenje, uporabite » py- Sintaksa Primer: uporaba navpičnega polnila za element HTML V tem primeru bomo uporabili » py-20 ' razred uporabnosti z ' Če želite v Tailwind dodati vodoravno in navpično oblazinjenje, uporabite » px-
< telo >
< div razred = 'bg-roza-600 px-20 w-max' >
Oblazinjenje v CSS hrbtnega vetra
div >
telo >
Izhod
Zgornji rezultat prikazuje oblazinjenje na levi in desni strani vsebnika. To pomeni, da je bilo vodoravno oblazinjenje uspešno uporabljeno za vsebniški element. Kako dodati navpično oblazinjenje v Tailwind?
Tukaj 'py' predstavlja 'y-os' ali 'navpično oblazinjenje'.
< div razred = 'bg-pink-600 py-20 w-max' >
Oblazinjenje v CSS hrbtnega vetra
div >
telo >
Izhod
Zgornji rezultat prikazuje oblazinjenje zgornje in spodnje strani vsebnika. To pomeni, da je bilo navpično oblazinjenje učinkovito uporabljeno za vsebniški element. Zaključek