أضف تأثير الظل إلى الصور باستخدام CSS3 Auto Code Generator

يتيح لك CSS تصميم صفحات الويب بسهولة ويسر. يمكنك تحديد أكثر من مائة من أنماط النص في صفحة واحدة (بالطبع ستظهر صفحتك لتبدو وكأنها خيمة سيرك) ولكنها تتعلق بالسهولة والمرونة التي تأتي مع استخدام CSS في صفحات الويب.صدمة يحتوي على منشئ مبرمج CSS سيساعدك على إضافة تأثيرات ظل مختلفة مختلفة لصورك في بضع نقرات بسيطة. اخترت التأثير ويكتب الرمز ؛ يمكن إضافة التأثيرات إلى الأسفل ، الجانبين ، أعلى وأسفل ، أسفل اليسار ، أسفل اليمين ، أعلى اليمين وأسفل اليسار أو في الزوايا القطرية.

قبل ان تبدأ؛ تحقق من أبعاد صورتك (التي تريد إضافة التأثير إليها). يحتوي منشئ الشفرة على حد أعلى وأدنى محدد مسبقًا يبلغ 130-347 بكسل لعرض الصورة وارتفاعها. إذا تجاوزت أبعاد صورتك هذا ، فيمكنك دائمًا تعديل العرض والارتفاع لاحقًا. يتيح لك الرمز أيضًا تحديد عتامة وضبابية الظل. لا يمكنك تحميل صورتك في منشئ الكود ، سيتم استخدام صورة افتراضية حتى تتمكن من معاينة التأثير.

من القائمة المنسدلة ، اختر تأثير الظل الذي يعجبك ، في كل مرة تقوم فيها بتغيير أي من المحددات ، يتم إنشاء رمز جديد ، لذا تأكد من استخدام أحدث واحد. بمجرد اختيار التأثير الذي يعجبك ، قم بتعيين العرض والارتفاع لصورتك باستخدام شريط التمرير الأفقي. استخدم مفتاحي السهم الأيمن والأيسر عندما تريد دفع الزر قليلاً فقط. تعيين الضبابية والعتامة وسيتم إنشاء رمز. تؤدي زيادة أو إنقاص أي من هذه المعلمات إلى إنشاء رمز جديد.

بمجرد تعيين كل شيء ، انسخ كود CSS إلى ملف CSS وقم بتسميته لصفحة الويب (أو السمة). يتم أيضًا إنشاء رمز HTML الموجود في صفحة الويب الخاصة بك (وهو فريد لكل تأثير تختاره من القائمة المنسدلة) ، انسخه وضع رمز الصورة (img src = "") حيث يقول "رمزك هنا'.

أفضل شيء في منشئ الشفرة هذا هو أنه يعمل مجانًا. لديها قيود أبعاد للصور ، ولكن يمكن تحريرها من التعليمات البرمجية. إذا كنت تستخدم صورة شفافة (مثل الصورة أعلاه) ، فستعطي خلفية رمادية باهتة. يمكنك تعديل لون الخلفية لاحقًا من الرمز. (تحرير خلفية سطر الكود: #ccc). تعطي الشفرة أيضًا إطارًا 5 بكسل لجميع الصور ، يمكنك تعديل الإطار أيضًا ولكن زيادة العرض وتقليله سيخفي الظل أو يكشفه أكثر من اللازم لذا من الأفضل تركه بمفرده.

قم بزيارة ThemeShock CSS Drop Shadow Generator