تعلم كيفية إضافة تأثيرات توهج بسرعة وسهولة باستخدام CSS3

إضافة توهج إلى عنصر صفحة ويب للتأكيد

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

أولا إنشاء عنصر لتوهج

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

إعطاء DIV فئة من توهج:


اضبط حجم ولون العنصر

بعد اختيار العنصر الذي ستقوم بتجميله باستخدام توهج ، امض قدمًا وقم بإضافة أي أنماط تريدها ، مثل لون الخلفية والحجم والخطوط. هذا المثال هو مستطيل أزرق. تم ضبط الحجم على 147 بكسل × 90 بكسل ؛ ويتم تعيين لون الخلفية إلى # 1f5afe ، أزرق ملكي. ويشمل هامش لوضع العنصر في وسط عنصر الحاوية السوداء.