ٹیل ونڈ میں ہوور پر 'بریک انسائیڈ' کیسے لگائیں؟

یہ مضمون Tailwind CSS میں ہوور پر 'بریک-اندر' کو لاگو کرنے کے طریقہ کار کی مثال دے گا۔

ٹیل ونڈ میں ہوور پر 'بریک انسائیڈ' کیسے لگائیں؟

ٹیل ونڈ میں ہوور پر 'بریک-اندر' لاگو کرنے کے لیے، HTML پروگرام میں مطلوبہ عناصر پر مخصوص 'بریک-اندر' یوٹیلیٹی کے ساتھ 'ہوور' پراپرٹی استعمال کریں۔ پھر، تصدیق کے لیے ویب صفحہ دیکھیں۔

عملی مظاہرے کے لیے، ذیل میں درج مراحل کو آزمائیں:

مرحلہ 1: 'بریک-اندر' یوٹیلیٹی کے ساتھ ہوور پراپرٹی کا استعمال کریں۔
ایک HTML پروگرام بنائیں اور استعمال کریں ' ہوور مطلوبہ 'بریک-اندر' یوٹیلیٹی کے ساتھ پراپرٹی۔ مثال کے طور پر، ہم نے ہوور پراپرٹی کو ' کے ساتھ استعمال کیا ہے۔ کالم کے اندر سے گریز کریں۔ ہوور پر

عنصر کے اندر کالم بریک سے بچنے کے لیے افادیت:

یہاں:

• ' کالم-2
  کو دو کالموں میں تقسیم کرنے کے لیے کلاس کا استعمال کیا جاتا ہے۔
• ' bg-yellow-500 کلاس پیلے رنگ کو
  کے پس منظر میں سیٹ کرتی ہے۔
• ' hover:break-inside-avoid-colum

  عنصر میں ”کلاس اس بات کی نشاندہی کرتی ہے کہ جب ماؤس پوائنٹر منڈلاتا ہے تو

  عنصر کے اندر کالم کے وقفے سے گریز کیا جانا چاہیے۔

مرحلہ 2: آؤٹ پٹ کی تصدیق کریں۔
اس بات کی تصدیق کرنے کے لیے کہ آیا ہوور پر 'break-inside-avoid-column' کی افادیت کا اطلاق کامیابی سے ہوا ہے، HTML ویب صفحہ دیکھیں:

مندرجہ بالا آؤٹ پٹ سے پتہ چلتا ہے کہ جب صارف مطلوبہ عنصر پر منڈلاتا ہے، تو عنصر کے اندر کالم کے وقفے سے گریز کیا جاتا ہے۔ اس سے ظاہر ہوتا ہے کہ ہوور پر موجود عنصر پر جس کے مطابق اس کی وضاحت کی گئی تھی اس پر 'بریک-اندر-ایوائڈ-کالم' کامیابی سے لاگو ہو گیا ہے۔

نتیجہ

ٹیل ونڈ میں ہوور پر 'بریک-اندر' لگانے کے لیے، ' ہوور 'مطلوبہ جائیداد' توڑ اندر HTML پروگرام میں افادیت۔ ہوور پراپرٹی کو کسی بھی عنصر کے ساتھ استعمال کیا جا سکتا ہے۔ تصدیق کے لیے، ویب صفحہ دیکھیں۔ اس مضمون میں Tailwind CSS میں ہوور پر 'بریک-اندر' لاگو کرنے کے طریقے کی وضاحت کی گئی ہے۔