Gets or sets one or more values that specify the durations of transitions on a set of corresponding object properties identified in the transition-property property.
This property is read/write.
![]() ![]() |
Syntax
transition-duration:
<time>
[ ,
<time>
] *
Property values
One or more transition times, separated by commas.
- time
-
Floating-point number, followed by a time units designator ("ms" or "s"). For more information about the supported time units, see CSS Values and Units Reference.
CSS information
| Applies To | all elements, :before and :after pseudo elements |
|---|---|
| Media | interactive |
| Inherited | no |
| Initial Value | 0 |
Standards information
- CSS Transitions Module Level 3, Section 2.2
Remarks
Transitions respect Cascading Style Sheets (CSS) box model constraints such as minWidth.
For example, if an element is declared with a minWidth value of "50px" then a transition to a width of "25px" is not valid. In a case such as this, the transition runs for the specified duration from the start value until a valid maximum or minimum end value, as appropriate.
Do not use the Microsoft vendor prefix ("-ms-") before the transition properties. They are supported unprefixed in Internet Explorer 10 and later.
To learn more about CSS transitions in Windows Internet Explorer, see How to bring your webpage to life with CSS transforms, transitions, and animations.
See also
- CSSStyleDeclaration
- currentStyle
- style
- a
- abbr
- acronym
- b
- bdo
- big
- br
- cite
- code
- dfn
- em
- i
- img
- input
- kbd
- label
- q
- samp
- select
- small
- span
- strong
- sub
- sup
- textArea
- tt
- var
- address
- blockQuote
- div
- dl
- fieldSet
- form
- noFrames
- noScript
- ol
- p
- pre
- table
- ul
- dd
- dt
- li
- tBody
- td
- tFoot
- th
- tHead
- tr
- button
- del
- ins
- map
- object
- script
- How to bring your webpage to life with CSS transforms, transitions, and animations
Send comments about this topic to Microsoft
Build date: 11/29/2012

