过度语法：.example {       transition-property: background-color;     //需要过度的css属性    transition-duration: 2s;               //过度所需要的时间    transition-timing-function: ease-in;   //过度的类型    transition-delay: 1s;   //过度延迟的时间} 大家都知道css代码是要简写的：过渡简写:example {       transition: background-color 2s ease-in 1s;   } 多项过度：.example {       transition:  background-color  2s ease-in 1s,                    width  2s ease-in-out,                    height 3s ease-out;   } 触发事件过渡：----例如  click  hover  类似的事件1、背景过度，一个背景为绿色当鼠标hover时延迟1s过度到蓝色；.example {       background-color: green;       transition: background-color  2s ease-in 1s;   }   .example:hover {       background-color: blue   } 2、当用户单击并按住元素时，发生宽度属性过渡，因此该元素保持 "活动" 状态。.example {       width: 200px;       height: 200px;       transition: width  2s ease-in;   }   .example:active {       width: 400px;   } 3、当你输入元素的时候input会变宽；input {       width: 200px;       transition: width 2s ease-in;   }   input:focus {       width: 250px;   }  4、可以几个属性同时进行变化；.example {       width: 200px;       height: 200px;       background:#000;    -webkit-transition: width 2s ease,         height 2s ease, background 2s ease;    -webkit-transform: translateZ(0);   }   .example:hover {       width: 300px;       height: 300px;       background:green;}