語法
transition: property duration timing-function delay|initial|inherit;
示例：
div {
width: 100px;
height: 100px;
transition: width 2s;
}
div:hover {
width: 300px;
}
CSS transition 演示
同時指定多個屬性
也可同時指定多個需要 transition 的屬性，每個屬性用逗號分隔，包含自己完整的時間，動畫方法（timing function）的指定。
div {
width: 100px;
height: 100px;
transition: width,height 2s;
}
div:hover {
width: 300px;
height: 300px;
}
CSS transition 同時作用於多個屬性
上面 width 只指定了屬性，未指定時間及動畫方法，所以動作的變化發是在瞬時完成的。
默認值
transition: all 0s ease 0s
意味着瀏覽器對所有元素所有屬性設置了 transitoin 但時長為 0。
所以實際使用中，只需要設置元素的 transition-duration 即可讓 transition 生效。
div {
width: 100px;
height: 100px;
- transition: width,height 2s;
+ transition-duration: 2s;
}
div:hover {
width: 300px;
height: 300px;
}
CSS transition 的默認值