Prosta animacja w CSS!

Chcecie zrobić prostą animację nie wykorzystując javascriptu? Nic prostszego.


Do dzieła!

Na początku tworzymy prostą listę punktowaną w pliku html o dowolnym tekście pamiętając aby każdą literę zapisać w osobnej linii.


lista

Następnie konfigurujemy wygląd naszego elementu w pliku CSS:

css

Po dodaniu stylów przyszedł czas na element magii za pomocą właściwości @keyframes. Właściwości możemy ustalać dowolne. Kwestia wyliczeń lub prób i błędów :p

animacja

  • K
  • R
  • Y
  • S
  • T
  • I
  • A
  • N

Powodzenia!

Dodaj komentarz