css transition

ease与ease-in-out的区别

两者的整体效果都是缓入缓出，只是细节上存在差异

	贝塞尔曲线
ease	cubic-bezier(0.25, 0.1, 0.25,1)
ease-in-out	cubic-bezier(0.42, 0, 0.58, 1)

比较两者的贝塞尔曲线，ease缓入效果较其缓出效果不明显；ease-in-out缓入缓出效果都比价明显

step-start 和step-end

step-start 等同于 steps(1, start), 过渡效果分一步完成，在步的起始开始，即直接过渡到效果

step-end 等同于 steps(1, end)， 过渡效果分一步完成，在步的结束开始，即transition-duration之后完成过渡效果

steps()

语法：steps(< integer >[, [ start | end ] ]?)

过渡步数为整数，第二个参数默认值为 end

start：表示过渡从第一步时间的开始开始(会直接看到过渡效果)

end：表示过渡从第一步时间的结束开始(不会直接看到过渡效果)

注意： transition-delay 将包含于步进函数的第一步，即第一步的持续时间为均分时间加上延迟时间