7-1 Transitions动画

transitions动画

共同的动画属性: transition: background-color 1s linear, color 1s linear, transform 1s linear;
单个属性的变化: background-color: darkblue;
多个属性的变化: background-color: darkblue; transform: rotate(30deg) ; color: #f80;

给图像做动画 transition: transform 2s ease;
:hover { background-color: darkblue; transform: rotate(360deg) scale(3); color: #f80; }

transform: rotate(-15deg); transform-origin: right top; transition: transform 1s ease ;
:hover { transform: rotate(-75deg); }
单摆,鼠标移上去摆到右边,移走摆回左边