Animate Color Transition Css Code Example

Example 1: css transition all

-webkit-transition: all .3s ease-in-out; -moz-transition:    all .3s ease-in-out; -o-transition:      all .3s ease-in-out; -ms-transition:     all .3s ease-in-out; transition:         all .3s ease-in-out;

Example 2: css background color transition

/* Answer to: "css background color transition" */  /*   Transitions currently work in Safari, Chrome, Firefox, Opera and   Internet Explorer 10+.    The following should produce a fade effect for you on the browsers   mentioned above: */  a {     background-color: #FF0; }  a:hover {     background-color: #AD310B;     -webkit-transition: background-color 1000ms linear;     -ms-transition: background-color 1000ms linear;     transition: background-color 1000ms linear; }