-
Activity Directions
Description:
100 Level - No experience necessary
In this project, you’ll create lots of fun stickers that you can use to decorate web pages. You’ll learn about using gradients that gradually change from one color to another to make your stickers look cool.
Learning Objectives
Styling and animation with CSS:
- Introducing
@keyframes rule for defining steps in an animation. - Reinforcing the use of properties to define the size, shape, position and color of elements on a webpage.
Challenges
“Diagonal animation” - editing animation @keyframe properties to use left:;
“Improve the sky” - add more keyframes and setting background:.
“More animation” - animate more images or elements using a variety of CSS properties.
Enter Your Submission
Past Submissions