Ისწავლეთ როგორ დაამატოთ Glow ეფექტები სწრაფად და ადვილად ერთად CSS3

Add Glow to ვებ გვერდი ელემენტის აქცენტი

რბილი გარე ბრწყინვალება დაემატა თქვენს ვებ-გვერდზე არსებულ ელემენტს, რომელიც იწვევს ელემენტს მაყურებელს. გამოიყენეთ CSS3 და HTML იმისათვის, რომ გამოიყენოთ დიაპაზონი მნიშვნელოვანი ობიექტის გარედან. ეფექტი ისეთივეა, როგორიც Photoshop- ში არსებულ ობიექტზე.

პირველი შექმნა ელემენტის Glow

Glow ეფექტი შეიძლება გაკეთდეს ნებისმიერ ფერის ფონზე, მაგრამ ისინი საუკეთესო ბნელ ფონზე, რადგან მაშინ Glow ჩანს shimmer მეტი. ამ მომრგვალებული კუთხის მართკუთხა ყუთში, DIV ელემენტი მოთავსებულია სხვა DIV ელემენტში შავ ფონზე. გარე DIV არ არის საჭირო glow, მაგრამ ძნელია glow თეთრი ფონზე.

მიეცით DIV კლასი Glow:


შექმენით ზომა და ფერი ელემენტის

მას შემდეგ, რაც თქვენ ელემენტს აირჩევთ, შეამჩნევთ ბრწყინავს, წავიდეთ წინ და დაამატოთ ნებისმიერი სტილის გინდათ, როგორიცაა ფონის ფერი, ზომა და შრიფტები. ეს მაგალითია ლურჯი მართკუთხედი; ზომის არის მითითებული, რომ 147px მიერ 90px; და ფონის ფერი არის მითითებული # 1f5afe, სამეფო ლურჯი. მასში შედის ზღვარი, რომ მოთავსდეს ელემენტის შუა შავი კონტეინერის ელემენტში.