یہ مضمون Tailwind CSS میں بریک پوائنٹس اور میڈیا کے سوالات کے ساتھ 'بریک آفٹر' کو استعمال کرنے کے طریقے کو ظاہر کرے گا۔
ٹیل ونڈ میں بریک پوائنٹس اور میڈیا سوالات کے ساتھ 'بریک آفٹر' کا استعمال کیسے کریں؟
بریک پوائنٹس اور میڈیا سوالات کے ساتھ 'بریک آفٹر' کو استعمال کرنے کے لیے، HTML پروگرام میں 'بریک آفٹر' یوٹیلیٹی کے ساتھ مختلف اسکرین سائزز کے لیے مختلف اقدار اور اسٹائل کی وضاحت کریں۔ پھر، HTML ویب صفحہ دیکھ کر آؤٹ پٹ کی تصدیق کریں۔
آئیے عملی نفاذ کا جائزہ لیں:
مرحلہ 1: 'بریک آفٹر' یوٹیلیٹی کے ساتھ بریک پوائنٹس اور میڈیا سوالات کا استعمال کریں۔
ایک HTML پروگرام بنائیں اور 'بریک آفٹر' یوٹیلیٹی کے ساتھ مختلف اسکرین سائز کے لیے مختلف اقدار اور اسٹائل کی وضاحت کریں۔ مثال کے طور پر، ہم نے استعمال کیا ہے ' md 'کے ساتھ بریک پوائنٹ' وقفے کے بعد کالم 'افادیت اور' ایل جی 'کے ساتھ بریک پوائنٹ' وقفے کے بعد سے بچنا 'افادیت:
< جسم >
< div کلاس = 'کالم-2 bg-teal-400' >
< ص کلاس = 'ایم ڈی:بریک-آفٹر-کالم ایل جی:بریک-آٹر-ایوڈ' > ہیلو... < / ص >
< ص > یہاں آنے پر خوش آمدید... < / ص >
< ص > Tailwind CSS کے بارے میں جانیں... < / ص >
< ص > یہ ایک CSS فریم ورک ہے... < / ص >
< ص > الوداع... < / ص >
< / div >
< / جسم >
یہاں:
- ' md:بریک آفٹر کالم 'کلاس اشارہ کرتی ہے کہ کالم کا وقفہ اس مخصوص
عنصر کے بعد ہونا چاہئے ' md بریک پوائنٹ (درمیانی سکرین کا سائز)۔
- ' lg: وقفے کے بعد سے گریز کریں۔ 'کلاس تجویز کرتی ہے کہ عنصر کو وقفے سے گریز کرنا چاہئے' ایل جی بریک پوائنٹ (بڑی اسکرین کا سائز)۔
مرحلہ 2: آؤٹ پٹ کی تصدیق کریں۔
HTML ویب صفحہ دیکھ کر تصدیق کریں کہ آیا بریک پوائنٹس اور میڈیا کے سوالات لاگو کیے گئے ہیں:
مندرجہ بالا ویب صفحہ میں، کالم کا وقفہ درمیانی اسکرین پر مخصوص عنصر پر ہوا ہے، اور بڑی اسکرین پر وقفے کے بعد سے گریز کیا گیا ہے۔
نتیجہ
Tailwind میں بریک پوائنٹس اور میڈیا سوالات کے ساتھ 'بریک آفٹر' کو استعمال کرنے کے لیے، پہلے ایک HTML فائل بنائیں۔ اس کے بعد، مختلف اقدار اور اسکرین کے مختلف سائز کے لیے اسٹائل بتا کر بریک پوائنٹس اور میڈیا سوالات کو 'بریک آفٹر' یوٹیلیٹی کے ساتھ استعمال کریں۔ تصدیق کے لیے، HTML پروگرام چلائیں اور ویب صفحہ دیکھیں۔ اس مضمون نے Tailwind CSS میں بریک پوائنٹس اور میڈیا کے سوالات کے ساتھ 'بریک آفٹر' کو استعمال کرنے کا طریقہ دکھایا ہے۔