By specifying the property and duration of the transition to an element to be modified.
The transition-property CSS property sets the CSS properties to which a transition effect should be applied.
/* 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: all, -moz-specific, sliding;
/* Global values */
transition-property: inherit;
transition-property: initial;
transition-property: unset;Source: https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property
The transition-duration CSS property sets the length of time a transition animation should take to complete. By default, the value is 0s, meaning that no animation will occur.
/* <time> values */
transition-duration: 6s;
transition-duration: 120ms;
transition-duration: 1s, 15s;
transition-duration: 10s, 30s, 230ms;
/* Global values */
transition-duration: inherit;
transition-duration: initial;
transition-duration: unset;Source: https://developer.mozilla.org/en-US/docs/Web/CSS/transition-duration