Tailwind CSS میں، بھرتی مخصوص عنصر کے مواد اور اس کی سرحد کے درمیان کی جگہ ہے۔ افقی پیڈنگ عنصر کے بائیں اور دائیں طرف کی جگہ ہے، جبکہ عمودی بھرتی ایک عنصر کے اوپر اور نیچے کی جگہ ہے۔ Tailwind مطلوبہ عناصر میں افقی یا عمودی پیڈنگ شامل کرنے کے لیے مختلف یوٹیلیٹی کلاسز پیش کرتا ہے۔
یہ مضمون وضاحت کرے گا:
ٹیل ونڈ میں افقی پیڈنگ کیسے شامل کریں؟
Tailwind میں کسی عنصر میں افقی پیڈنگ شامل کرنے کے لیے، 'px-
نحو
< عنصر کلاس = 'px-0 ...' > ... عنصر >
یہاں 'px' 'x-axis' یا 'افقی پیڈنگ' کی نمائندگی کرتا ہے۔
مثال: HTML عنصر پر افقی پیڈنگ لگانا
اس مثال میں، ہم استعمال کریں گے ' px-20 'یوٹیلٹی کلاس' کے ساتھ Tailwind میں کسی عنصر میں عمودی پیڈنگ شامل کرنے کے لیے، ' py- نحو مثال: HTML عنصر پر عمودی پیڈنگ کا اطلاق کرنا اس مثال میں، ہم استعمال کریں گے ' py-20 'یوٹیلٹی کلاس' کے ساتھ Tailwind میں افقی اور عمودی پیڈنگ شامل کرنے کے لیے، ' px-
< جسم >
< div کلاس = 'bg-pink-600 px-20 w-max' >
پیڈنگ میں ٹیل ونڈ سی ایس ایس
div >
جسم >
آؤٹ پٹ
مندرجہ بالا آؤٹ پٹ کنٹینر کے بائیں اور دائیں جانب پیڈنگ کو دکھاتا ہے۔ اس سے ظاہر ہوتا ہے کہ افقی پیڈنگ کنٹینر کے عنصر پر کامیابی کے ساتھ لگائی گئی ہے۔ Tailwind میں عمودی پیڈنگ کیسے شامل کریں؟
یہاں 'py' 'y-axis' یا 'عمودی پیڈنگ' کی نمائندگی کرتا ہے۔
< div کلاس = 'bg-pink-600 py-20 w-max' >
پیڈنگ میں ٹیل ونڈ سی ایس ایس
div >
جسم >
آؤٹ پٹ
مندرجہ بالا آؤٹ پٹ کنٹینر کے اوپر اور نیچے کی طرف پیڈنگ کو دکھاتا ہے۔ اس سے ظاہر ہوتا ہے کہ کنٹینر کے عنصر پر عمودی پیڈنگ کو مؤثر طریقے سے لاگو کیا گیا ہے۔ نتیجہ