最近在网上看到很多transition写的效果，借鉴http://www.w3school.com.cn分享下代码，
1.语法：transition: property duration timing-function delay;
| transition-property | 规定设置过渡效果的 CSS 属性的名称。 | ||||||||||||
|
|||||||||||||
| transition-duration： | 规定完成过渡效果需要多少秒或毫秒。 | ||||||||||||
| transition-timing-function： | 规定速度效果的速度曲线。 | ||||||||||||
|
|||||||||||||
| transition-delay： | 定义过渡效果何时开始。 | ||||||||||||
2.css：
.box{width:100px;height:100px;position:relative; background-color:#F00;transition:width 2s ease 2s,height 2s ease-out 2s,color 2s ease,top 2s;}
.box:hover{width:200px;height:200px; background-color:#0FF;top:-10px;}
/*-moz-transition:*//* Firefox 4 */
/*-webkit-transition:*//* Safari 和 Chrome */
/*-o-transition:*//* Opera */
3.html：
<!--把鼠标放到 div 元素上，宽度会从 100px 逐渐变为 200px：-->
<div class="box"></div>
4.浏览效果：
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGkAAABuCAIAAACr5arVAAAA0klEQVR4nO3QsQnAAAwDQe+/tNOnCm7Cw4kfQNysXTd/HwiP3X3s7mN3H7v72N03u7sz+ho7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxasWPHrhU7duxave3sNHb3sbvvAeKjBB5N/0teAAAAAElFTkSuQmCC" alt="" /> aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMoAAADRCAIAAAACFrqnAAACMklEQVR4nO3SwQnAMAwEQfXftPII6SCLwcwx1tuPnTXLNqc/YDdPXhZOXhZOXhZOXhZu3ge/kxcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkhcheRGSFyF5EZIXIXkRkheh/a5ZMnlZOHlZuAezDj9C00DBOwAAAABJRU5ErkJggg==" alt="" />
备注：这个方法不适合IE10以下的浏览器