يمكنك تستخدم المتغيرات بـ CSS ؟ 🔥
📍 تدري انه يمديك تستخدم المتغيرات بـ CSS ؟ 🔥
تعالوا اشرح لكم ماهي المتغيرات وكيف تستخدمها بشغلك
😍👇⬇
ماهي المتغيرات ؟
يمكننا من خلال المتغير من تخزين قيمة بداخلة ,ثم إعادة استخدامها بكل الكود
, يعني ما يحتاج تكرر القيمة كل مره بس حطها بالمتغير واستخدمها باي مكان تريده
المتغيرات بـ CSS تجعل عملنا أسهل وأكثر سيطرة وتخصيص للكود ..
تخيل أن لديك مشروع كبير ورغبت بتغيير الألوان او الخطوط ,وهذا يعني ان عليك تغيير كل لون يدوياَ وبشكل فردي ..
⬇⬇
لكن باستعمال المتغيرات يمكنك تعريف متغير واستخدامه بكل الاكواد ومن ثم اذا رغبت بتغيير قيمته , يمكنك ذلك بسهولة وبدون تغيير جميع الاكواد.😍
يعني تسهل عليك التعديل بشكل كبير
تعريف متغير :
- يمكننا تعريف متغيرات تكون عامه global او محليةlocal .
- يمكننا تعريف متغير بـCSS عن طريق كتابة (--) ومن ثم أسم المتغير وقيمته كما بالمثال التالي...
استخدام المتغير :
لاستخدام المتغير يمكننا ذلك بسهولة عن طريق كتابة var ثم اسم المتغير مثل var(--primary-color) ...
كما تلاحظ استخدمنا المتغير --primary-color ليكون قيمة لخاصية لون الخلفية background-color .
أنواع المتغيرات :
هناك نوعين من المتغيرات بـ CSS
- global
- local
global
ويمكنك استخدامها والوصول إليها من أي مكان بالملف لأنها تكون عامة ويتم كتابتها بداخل root:
local
محليه اي يمكنك تعريفها واستخدامها بداخل كلاس او ID محدد او الأبناء التابعه لهذا الكلاس ...
تعليقات
إرسال تعليق