إنشاء ظلال CSS
كوّن طبقات box-shadow داخلية أو خارجية، مع معاينة وناتج CSS قابل للنسخ والتنزيل.
طريقة الاستخدام
أدخل قيم الطبقة الأولى ولونها، واختر الداخلي عند الحاجة. أضف طبقات ورتبها بأزرار التحريك. أنشئ النتيجة، ثم راجع المعاينة وانسخ قاعدة .shadow أو نزّلها.
إزاحة 0 و4، وتمويه 12، وانتشار 0، ولون #00000080 تنتج box-shadow: 0px 4px 12px 0px #00000080؛ طبقة سوداء بشفافية تقارب النصف.
حدود الدعم
الطبقة الأولى في الأمام؛ التحريك يغير ترتيب الرسم. الانتشار السالب صالح، أما التمويه السالب فمرفوض. الشفافية من قناة HEX؛ لا يغيّر CSS أبعاد العنصر في التخطيط. نافذة المعاينة محدودة وقد تقص أطراف ظلال كبيرة، بينما الملف يحتفظ بالقيم كاملة. هذا box-shadow وليس text-shadow أو تأثير صورة.
أسئلة شائعة
هل الظل الأول يغطي الطبقات التالية دائمًا؟
يُرسم فوقها وفق ترتيب CSS، لكن النتيجة المرئية تعتمد على مواضع الطبقات وألوانها وشفافيتها وخيار الظل الداخلي.