Animacje w CSS - Zadanie

Tworzenie strony z animowanym nagłówkiem i pulsującym przyciskiem

Cel zadania:

Twoim zadaniem jest stworzenie strony internetowej, na której:

1. Nagłówek (<h1>) przesuwa się z lewej strony ekranu do środka po załadowaniu strony.
2. Przycisk (<button>) pulsuje (zmienia rozmiar w sposób cykliczny), aby przyciągnąć uwagę użytkownika.

Wymagania techniczne:

• Użyj znaczników HTML do stworzenia struktury strony (np. <header>, <h1>, <button>).
  
  
• Zastosuj style CSS, w tym:
  
  
  • Animację przesunięcia nagłówka za pomocą @keyframes i animation.
  • Animację pulsowania przycisku za pomocą @keyframes, animation i transform.
  • Dodaj podstawowe style (kolory, tło, odstępy), aby strona wyglądała estetycznie.
• Strona powinna być wyśrodkowana i czytelna.

Dodatkowe wyzwanie (na bdb):

• Dodaj efekt zmiany koloru tła przycisku podczas pulsowania.

• Zmień czas trwania animacji nagłówka, aby była wolniejsza lub szybsza.

Przykład efektu animacji po naciśnięciu na grafike: