CSS CSS Animations & Transitions

Question 1

Which CSS property is used to specify the duration of a transition effect?

Accepted Answer

transition-duration

Answer

The `transition-duration` property sets how long a CSS transition takes to complete.

Question 2

Which CSS at-rule is used to define keyframes for an animation?

Accepted Answer

@keyframes

Answer

The `@keyframes` at-rule lets you define the stages of a CSS animation by specifying styles at various percentage points.

Question 3

What value of `animation-fill-mode` keeps the element styled by the last keyframe after the animation ends?

Accepted Answer

forwards

Answer

The `forwards` value retains the styles defined in the final keyframe once the animation has completed.

Question 4

Which CSS property controls the speed curve of a transition or animation?

Accepted Answer

transition-timing-function

Answer

The `transition-timing-function` property specifies the speed curve (e.g., ease, linear, ease-in-out) for the transition.

Question 5

Which keyword value for `animation-iteration-count` causes an animation to repeat indefinitely?

Accepted Answer

infinite

Answer

Setting `animation-iteration-count: infinite` makes the animation loop continuously without stopping.

CSS Language Practice Test