في هذا الثريد سوف نتعلم أكثر عن
ال box-shadow في css
و كيف يمكننا أن نستخدمه مثل المحترفين
قراءة ممتعة 😇
🧵⬇️
ال box-shadow في css
و كيف يمكننا أن نستخدمه مثل المحترفين
قراءة ممتعة 😇
🧵⬇️
في البداية هذا الثريد
جزء من سلسلة
تعلم الرسم بستخدام Css
و الهدف الأساسي من هذه الثريدات
فهم أعمق لخواص ال Css
يتم عمل هذه الثريدات
بمساعده الأخ @naif4web
⬇️
جزء من سلسلة
تعلم الرسم بستخدام Css
و الهدف الأساسي من هذه الثريدات
فهم أعمق لخواص ال Css
يتم عمل هذه الثريدات
بمساعده الأخ @naif4web
⬇️
⭕ في البدايه سوف نتعرف
على القيم التي نستطيع
إستخدامها في الخاصية
box-shadow
الصوره تحت توضح أهم
القيم التي سوف نستخدمها
نلاحظ في الاتجاهين العمودي و الأفقي
يتم قبول القيم السالبة و الموجبة
⬇️
على القيم التي نستطيع
إستخدامها في الخاصية
box-shadow
الصوره تحت توضح أهم
القيم التي سوف نستخدمها
نلاحظ في الاتجاهين العمودي و الأفقي
يتم قبول القيم السالبة و الموجبة
⬇️
⭕ القيمه الضبابية
في هذه القيمه يتم تحديد ضبابية الظل
كما نلاحظ في الصورة تحت
القيمه الأكبر تعني ضبابية أكثر
⬇️
في هذه القيمه يتم تحديد ضبابية الظل
كما نلاحظ في الصورة تحت
القيمه الأكبر تعني ضبابية أكثر
⬇️
⭕ قيمه الإنتشار
القيمه المسؤؤله عن حجم الظل
إذا ازداد الرقم كبر حجم الظل
عند إستخدام القيم السالبة
يتم تصغير حجم الظل
كما نلاحظ في الصورة تحت
⬇️
القيمه المسؤؤله عن حجم الظل
إذا ازداد الرقم كبر حجم الظل
عند إستخدام القيم السالبة
يتم تصغير حجم الظل
كما نلاحظ في الصورة تحت
⬇️
بإستخدام قيمه الإنتشار فقط
نستطيع امتلاك
حدود (border)
با العدد الذي نريد 😊
يمكننا إستغلال هذا الأمر في عمل outline إحترافي للعنصر الذي نريد
⬇️
نستطيع امتلاك
حدود (border)
با العدد الذي نريد 😊
يمكننا إستغلال هذا الأمر في عمل outline إحترافي للعنصر الذي نريد
⬇️
⭕ إستخدام أكثر من ظل في نفس العنصر:
يمكننا إستخدام أكثر
من ظل بقيم مختلفه
عن طريق الفصل بين كل
ظل باستخدام فاصله
كما نلاحظ في الصورة تحت
⬇️
يمكننا إستخدام أكثر
من ظل بقيم مختلفه
عن طريق الفصل بين كل
ظل باستخدام فاصله
كما نلاحظ في الصورة تحت
⬇️
⭕ باستخدام ما تعلمنا سابقا
نستطيع تكوين أشكال في غاية التعقيد
باستخدام عنصر div وأحد فقط
في الصورة تحت
نمتلك عنصر div أسود
و بإستخدام الظل استطعنا تشكيل
شكل في غاية التعقيد بعدد أسطر css قليل جدا
⬇️
نستطيع تكوين أشكال في غاية التعقيد
باستخدام عنصر div وأحد فقط
في الصورة تحت
نمتلك عنصر div أسود
و بإستخدام الظل استطعنا تشكيل
شكل في غاية التعقيد بعدد أسطر css قليل جدا
⬇️
تحدي الرسم
المطلوب عمل نفس الأشكال تحت
باستخدام عنصر div وأحد فقط
كل التوفيق للجميع 😇
المطلوب عمل نفس الأشكال تحت
باستخدام عنصر div وأحد فقط
كل التوفيق للجميع 😇
وصلنا إلى نهايه هذا الثريد الممتع 🙃
نلتقي في ثريد أخر 😇
إذا أعجبك الثريد
لا تنسى تسوي ريتويت 😊
Happy Coding With Css 👩🏻💻
نلتقي في ثريد أخر 😇
إذا أعجبك الثريد
لا تنسى تسوي ريتويت 😊
Happy Coding With Css 👩🏻💻
جاري تحميل الاقتراحات...