Transitions Flashcards
What are CSS transitions used for?
CSS transitions interpolate between two states (initial and target).
What is the purpose of the transition-property?
It specifies which CSS properties to transition.
How do you define multiple properties for transition-property?
By listing them as a comma-separated list.
What does transition-duration define?
It defines the length of time a transition will take to complete.
What time units can be used with transition-duration?
Seconds and milliseconds.
What is the shorthand property for CSS transitions?
The shorthand property is transition, which combines transition-property, transition-duration, transition-timing-function, and transition-delay.
How is the shorthand transition written?
transition: <property> <duration> <timing-function> <delay>;</delay></timing-function></duration></property>
What elements can have transitions?
Elements that can have a middle state, between start and final states.
What CSS properties can be transitioned?
transform (scale, rotate, translate)
color, background-color, border-color
Shadows (for elevation change)
Which CSS property is used for transitioning transform effects?
The transform property.
What triggers CSS transitions?
Events like :hover, :focus, :active, and :target.
What type of visual effect can shadows indicate in CSS transitions?
Shadows indicate elevation changes.