CSS3 Transitions

transition

css3 transition properties

css3 transition show that we can add effects via css or jquery and it has 4 properties see below, but i used the shorthand of it.
.mytransition {
     transition-property transition-duration transition-timing-function transition-delay
}

CSS:
.mytransition {
     background:blue;
     width:200px;
     padding:10px;
     height:150px;
     transition: all .5s linear;
     color:white;
}

.mytransition:hover {
     background:yellow;
     color:red;
}

HTML:

<div class="mytransition">your content here...</div>

LIVE DEMO:

See the Pen css3 transition by clark fortuna (@graydirt) on CodePen.

LIVE DEMO 2:advanced css3 transition

See the Pen advance css3 transition by clark fortuna (@graydirt) on CodePen.