Transition (transition) is one of the features of CSS3 subversive, we can without the use of JavaScript or Flash animation, when elements from a style transformation effect is to add another style for the element.
Animation Frame: a fixed order and playback speed by a picture frame. Such as motion picture film
In transition can be realized in CSS3 tween (transitions), as long as the current element and the "Properties" i.e., two states (A and B refers to our generation), a smooth transition can be achieved changes, in order to facilitate demo using hover between two states, but not limited to hover state to make the transition.
Syntax:
transition: the transition to attribute to spend time motion curve when to start;
if multiple sets of attributes change, or separated by commas.
If you want to change all properties of transition, all you can write a
transition-duration in seconds it takes time 0.5s s such that s must write unit ms ms
The default is when to start immediately began 0s
A schematic view of the motion profile:
{div width: 200px; height: 100px; background-Color: Pink; / * Transition: when to transition start attribute takes time motion profile; * / Transition: width 0.6s EASE 0s, height 0.3s EASE-in lS; / * transtion meaning of this sentence written transitions rather than inside the div hover inside * / } div: hover { / * rollover boxes, we changed the width * 400 / width: 600px; height: 300px by } transition: all 0.6s; / attributes * All variations can be used behind the two all attributes may be omitted * /