最終更新日 
transition-propertyプロパティ
transition-propertyは、遷移させるプロパティを指定するプロパティです。
CSS3では、時間経過と共に要素のプロパティの値を徐々に変化させる、遷移のためのプロパティが定義されています。これを使うと、時間の経過によって要素の位置を変えたり、背景色を変えたりといった、アニメーション効果を表現できます。
transition-propertyでは、値に遷移対象のプロパティ名を指定します。カンマで区切って複数のプロパティ名を指定できます。
遷移関連プロパティの値をまとめて指定する場合は、transitionを使用します。
CSS3での変更点
・transition-propertyは、CSS3から新しく追加されたプロパティです。
| 初期値 | 適用先 | 継承 |
|---|---|---|
| all | すべての要素、::before擬似要素セレクタ、::after擬似要素セレクタ | なし |
| 値 | 説明 |
|---|---|
| all | 遷移可能な全てのプロパティを遷移対象として指定します。（初期値） |
| none | 遷移させるプロパティを指定しません。 |
| プロパティ名 | 遷移させるプロパティ名を指定します。カンマで区切って複数のプロパティ名を指定できます。 |
サンプルコード
transition-property: all; transition-property: none; transition-property: color; transition-property: background-color; transition-property: color, background-color; transition-property: color, background-color, margin; transition-property: color, background-color, margin, width;
参考文献：CSS Transitions
ザマワンにエントリーしました！
『ザマワン』は「座間ワンミニッツ」の略称であり、座間市の魅力を１分にギュッと詰め込む動画コンテストです。