transition

transitionは以下のプロパティーをショートハンドで指定するときに使用します。

• transition-property
• transition-duration
• transition-timing-function
• transition-delay

用例

transition-durationとtransition-delayは時間の指定でショートハンドで記述時、transition-durationが先行されるので、用例の順番通り記述するのが無難でしょう。複数のプロパティに指定する場合は、指定するセットを,カンマで区切ります。

transition: transition-propertyの値 transition-durationの値 transition-timing-functionの値 transition-delayの値;

一般的な用例

transition-delayは0でも単位のsまで指定

div.mt{
  margin-top:0;
  transition: margin-top 0.6s ease-in-out 0s;
}
div.mt:hover{
  margin-top:50px;
}