CSS CSS Animations & Transitions 2

Question 1

Which shorthand property combines `transition-property`, `transition-duration`, `transition-timing-function`, and `transition-delay`?

Accepted Answer

transition

Answer

The `transition` shorthand lets you specify all four transition sub-properties in a single declaration.

Question 2

What CSS function is commonly used inside `@keyframes` to create smooth color transitions?

Accepted Answer

rgb()

Answer

The `rgb()` function specifies colors in keyframes, and the browser interpolates between them smoothly during the animation.

Question 3

Which `animation-play-state` value pauses a running animation?

Accepted Answer

paused

Answer

Setting `animation-play-state: paused` halts the animation at its current frame without resetting it.

Question 4

How do you target the starting state of an animation inside `@keyframes`?

Accepted Answer

from or 0%

Answer

Inside `@keyframes`, `from` is an alias for `0%` and defines the initial state of the animation.

Question 5

Which CSS property applies a 2D or 3D transformation to an element, often combined with transitions?

Accepted Answer

transform

Answer

The `transform` property applies functions like `translateX()`, `rotate()`, and `scale()` to visually modify an element.

CSS Language Practice Test