Assignment029j32a - Keyframes

CSS keyframes allow you to animate elements. In the following examples, we specify animation name for the elements and provide a @keyframes code block. These are simple animations that can change from a beginning to end state using the from {} and to {} code blocks.

Here are additional properties to learn:

• animation-name:
• animation-duration:
• aniamtion-iteration-count:
• animaition-timting-function:
• animation-direction:

Here's one example of element code and the binded animation. In order to get credit for this assignment, you must also animate, you must also animate on your portfolio.

#black {
    background-color: black;
    animation-name:  changecolor;
    animation:duration: 4s;
}

@keyframes changecolor {
    from {
        background-color:black;
    }

    to{
        background-color:red;
    }
}