يوفر Tailwind CSS ' محاذاة العناصر 'أدوات للتحكم في موضع العناصر المرنة والشبكة على طول المحور المتقاطع للحاوية. يحتوي على فئات أدوات مساعدة مختلفة ، مثل 'items-start' و 'items-center' و 'items-end' و 'items-baseline' وما إلى ذلك. علاوة على ذلك ، يمكن للمستخدمين أيضًا استخدام خاصية hover مع 'items-
ستوضح هذه المقالة طريقة تطبيق التحويم على الأدوات المساعدة 'محاذاة العناصر' في Tailwind CSS.
كيفية تطبيق Hover على أدوات 'align-items' المساعدة في Tailwind؟
لتطبيق التمرير فوق الأدوات المساعدة 'align-items' في Tailwind ، أنشئ بنية HTML وأضف العنصر ' يحوم 'فئة المرافق مع' المطلوب ' العناصر- <القيمة> 'في الحاوية. بعد ذلك ، تحقق من صفحة ويب HTML وحرك الماوس فوق العنصر المحدد للتحقق من التغييرات.
بناء الجملة
< عنصر فصل = 'التمرير: العناصر- <القيمة> ...' > ... عنصر >
استبدل
مثال
في هذا المثال ، سنصنع حاوية مرنة بالخاصية 'items-start'. بعد ذلك ، سوف نستخدم ' تحوم: مركز العناصر 'فئة في' انتاج | لتطبيق تأثير التمرير على الأدوات المساعدة 'align-items' في Tailwind ، استخدم ' يحوم 'فئة المنفعة مع' العناصر- <القيمة> 'في الحاوية المرنة أو الشبكة. للتحقق ، قم بتمرير الماوس فوق الحاوية المحددة على صفحة الويب. توضح هذه المقالة أمثلة لتطبيق تأثير التمرير على الأدوات المساعدة 'محاذاة العناصر' في Tailwind.
< جسم >
< شعبة فصل = 'تحوم العناصر المرنة - بدء التمرير: مركز العناصر - ضبط العناصر - مركز النص h-44 m-3 bg-pink-300 gap-4' >
< شعبة فصل = 'bg-pink-600 py-4 w-40' > 1 شعبة >
< شعبة فصل = 'bg-pink-600 py-12 w-40' > 2 شعبة >
< شعبة فصل = 'bg-pink-600 py-8 w-40' > 3 شعبة >
شعبة >
جسم >
هنا:
من صفحة الويب أعلاه ، يمكن ملاحظة أن محاذاة العناصر المرنة تتغير على طول المحور العرضي للحاوية عند التمرير. خاتمة