Yazeka
Arama sonuçlarına göre oluşturuldu
Puls efekti oluşturmak için aşağıdaki adımlar izlenebilir:
- HTML kodu 2. Görüntü,
<img>
etiketi içine eklenir 2.<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Pulse Effect</title> </head> <body> <img class="moonPulse" src="https://i.pinimg.com/564x/a1/01/e2/a101e22fc458c1110d418ee309f240c8.jpg" alt="moon pic"/> </body> </html>
- CSS kodu 2. Gövde ve görüntü stilize edilir 2.
body{ display: flex; align-items: center; justify-content: center; margin-top: 5em; background: #000; } .moonPulse{ animation: pulse 1s infinite; border-radius: 50%; width: 20em; } @keyframes pulse{ from{ box-shadow: 0 0 0 0 rgba(198, 182, 179, 0.85); } to{ box-shadow: 0 0 0 30px rgba(201, 48, 48, 0); } }
Puls efekti oluşturmak için ayrıca aşağıdaki kaynaklar kullanılabilir:
5 kaynaktan alınan bilgiyle göre: