#transition-property

#Introduction

The transition-property CSS property sets the CSS properties to which a transition effect should be applied.

#Examples

css-apisrc/transition-property/App.tsx

Preview

#Syntax

/* Keyword values */
transition-property: none;
transition-property: all;

/* <custom-ident> values */
transition-property: test_05;
transition-property: -specific;
transition-property: sliding-vertically;

/* Multiple values */
transition-property: test1, animation4;
transition-property: all, height, color;
transition-property:;

#Values

• left
• right
• top
• bottom
• width
• height
• opacity
• background-color
• color
• transform
• max-width
• min-width
• max-height
• min-height
• padding-left
• padding-right
• padding-top
• padding-bottom
• margin-left
• margin-right
• margin-top
• margin-bottom
• border-left-width
• border-right-width
• border-top-width
• border-bottom-width
• border-left-color
• border-right-color
• border-top-color
• border-bottom-color
• flex-basis
• flex-grow
• filter

#Formal definition

#Formal syntax

transition-property:opacity|width|height|background-color|visibility|top|right|left|bottom|transform|all|none;

#More

• transition-delay
• transition-duration
• transition
• transition-timing-function
• Animation Event

#Compatibility

LCD tables only load in the browser