| 1 | 2 | 3 | 4 | 5 |
| Use html and CSS to insert five images of wheels with margins of 20px each.All the wheels should have width of 80px and height of 80px. | Place all the wheels in a parent box of width 950px and height 650px.Using CSS, give the parent box a shadow and a border of 1px. | Using CSS apply animation-duration of 2 seconds, animation-delay of 1s, animation-direction of alternate and animation-iteration-count of infinite to all the wheels. The animation-name for each wheel should be as follows: a. mywheel1 b. mywheel2 c. mywheel3 d. mywheel4 e. mywheel5 |
Each wheel should have a differnt timing function as follows: a. wheel1 : linear b. wheel2 : ease c. wheel3 : ease-in d .wheel4 : ease-out e. wheel5 : ease-in-out |
Under the @keyframes rule for each wheel apply the following styles. a. 0%: rotate to 0 degrees and translateX of 0px b. 100%: rotate to 720 degrees and translateX of 850px; |