Css3 Pr Transition Property
Css Pr Grid
Sel Active
Pr Outline Style
Pr Class Clear
Css Selectors
Pr Mix Blend Mode
Css3 Pr Target New
Sel Out Of Range
Pr Dim Min Height
Sel Checked
Css Backdrop Filte
Css3 Pr Target Position
Css3 Pr Align Items
Pr Border Left Style
Css3 Pr Transition Timing Function
Pr Border Bottom_Color
Css3 Pr Resize
Css3 Pr Text Justify
Func Cubic Bezier
Css3 Pr Animation Direction
Pr Font Font Family
Func Calc
Css Animatable
Pr Grid Template Rows
Css Colors
Pr Dim Line Height
Func Rgb Css
Sel Hover
Css3 Pr Perspective Origin
Sel Link
Css3 Pr Column Rule Style
Css3 Pr Border Image Source
Sel Element Pluss
Sel Id
Css3 Pr Row Gap
Sel Firstletter
Sel In Range
Css3 Pr Gap
Func Repeating Radial Gradient
Sel Invalid
Sel Empty
Pr Clip Path
Css3 Pr Border Bottom Left Radius
Pr Pos Z Index
Css3 Pr Transition Delay
Pr Text Direction
Css3 Pr Animation Fill Mode
Css3 Pr Appearance
Pr Gen Content
Sel Optional
Pr Border Right Color
Css3 Pr Pointer Events
Css Websafe Fonts
Sel After
Css3 Pr Font Stretch
Pr Grid Template Columns
Css3 Pr Nav Index
Pr Grid Row Gap
Pr Text Text Transform
Sel Attribute Value Contains
Pr Background Repeat
Sel Disabled
Css3 Pr All
Func Conic Gradient
Sel Only Of Type
Pr Tab Caption Side
Pr Grid Row End
Pr Font Font Size
Css3 Pr Animation Play State
Pr Border Righ
Sel Firstchild
Pr Print Pagebb
Pr Padding Top
Pr Border Right Width
Css3 Pr Grid Columns
Css3 Pr Box Pack
Css Ref Aural
Pr Padding Right
Sel Attr End
Css3 Pr Border Image
Sel Element Element
Css3 Pr Backface Visibility
Css3 Pr Background
Pr Border Right
Css3 Pr Flex Wrap
Sel Only Child
Sel Not
Css3 Pr Outline Offset
Func Repeating Conic Gradient
Func Radial Gradient
Pr Border Left Color
Sel Valid
Css3 Pr Animation Keyframes
Sel Before
Css3 Pr Border Bottom Right Radius
Css3 Pr Word Wrap
Pr Grid Auto Flow
Css3 Pr Nav Down
Css3 Pr Rotation
Pr Object Fit
Pr Outline Color
Pr Text Word Spacing
Pr Gen Counter Increment
Pr Import Rule
Sel Class
Css3 Pr Column Rule Width
Sel Nth Of Type
Css3 Pr Flex
Css3 Pr Nav Up
Css3 Pr Border Top Right Radius
Pr Margin Left
Css3 Pr Transform Style
Pr Padding Left
Css Pr Writing Mode
Sel Last Of Type
Pr Outline Width
Css3 Pr Filter
Pr Font Weight
Css3 Pr Transform
Pr Grid Gap
Pr Pos Right
Css3 Pr Text Overflow
Css3 Pr Column Rule Color
Pr Border
Pr Border Left Width
Sel Root
Css3 Pr Hanging Punctuation
Sel Element Comma
Pr Grid Area
Pr Gen Quotes
Css3 Pr Border Image Slice
Css3 Pr Animation Timing Function
Pr Grid Auto Row
Pr Border Left
Pr Tab Empty Cellsp
Css3 Pr Justify Content
Pr Border Right Style
Css3 Pr Box Flex Group
Sel Selection
Css3 Pr Animation
Sel All
Sel Nth Last Of Type
Css3 Browsersupport
Css3 Pr Border Image Outset
Css Reference
Pr Background Blend Mode
Css3 Pr Box Sizing
Sel Nth Child
Pr Grid Column
Css3 Pr Font Face Rule
Sel Element
Pr Pos Clip
Pr Text Color
Pr Pos Vertical Align
Pr Margin Right
Sel Attribute Value Lang
Css3 Pr Transition Duration
Pr Dim Max Width
Pr Background Image
Css3 Pr Column Fill
Css Inherit
Pr Grid Column Start
Pr Class Cursor
Func Repeating Linear Gradient
Css3 Pr Box Orient
Sel Focus
Pr Margin Bottom
Pr Grid Column End
Pr Padding
Pr Font Font Style
Pr Border Collapse
Css Initial
Sel Attribute Value
Pr Mix Blend Mode Html
Css3 Pr Font Size Adjust
Css3 Pr Opacity
Pr List Style Position
Pr Grid Column Gap
Sel Attribute
Css3 Pr Flex Flow
Css3 Pr Icon
Css3 Pr Mediaquery
Pr Text Text Indent
Sel Last Child
Css3 Pr Border Image Repeat
Sel Firstline
Pr Grid Row
Css3 Pr Text Decoration Style
Css3 Pr Target Name
Func Var
Pr Print Pageba
Func Rgba
Pr Text Text Decoration
Pr Border Style
Func Counter
Sel Read Only
Pr List Style Image
Css3 Pr Rotation Point
Css3 Pr Background Size
Pr Border Bottom
Css3 Pr Punctuation Trim
Pr Font Font Variant
Pr Border Top Width
Pr Pos Bottom
Css3 Pr Animation Delay
Pr Background Position
Pr Grid Auto Columns
Css3 Pr Background Origin
Css3 Pr Grid Rows
Css3 Pr Overflow Y
Css3 Pr Box Ordinal Group
Css3 Pr Box Direction
Pr Grid Template Areas
Pr Background Color
Pr Gen Counter Reset
Css3 Pr Align Content
Pr Print Pagebi
Func Hsl
Pr Border Bottom Style
Pr Grid Template
Css3 Pr Flex Grow
Css3 Pr Flex Basis
Sel Element Gt
Css3 Pr Target
Pr Object Position
Css3 Pr Text Wrap
Css3 Pr Column Rule
Css3 Pr Text Emphasis
Func Minmax
Sel Lang
Pr Grid Auto Rows
Pr List Style Type
Pr Pos Overflow
Css3 Pr Order
Func Max
Css3 Pr Text Outline
Pr Grid Row Start
Pr Pos Top
Css3 Pr Text Shadow
Pr Border Top Color
Pr Text Text Align
Func Min
Pr Dim Max Height
Css Functions
Pr Class Display
Pr Dim Height
Sel Gen Sibling
Css3 Pr Animation Duration
Pr Border Spacing
Func Repeat
Sel Attr Begin
Pr Border Width
Css3 Pr Overflow X
Pr Outline
Css3 Pr Tab Size
Css3 Pr Animation Name
Pr Dim Width
Css3 Pr Text Decoration Line
Css Units
Css3 Pr Box Flex
Css3 Pr Word Break
Func Attr
Pr Margin Top
Pr Text Unicode Bidi
Css3 Pr Text Align Last
Css3 Pr Columns
Css3 Pr Align Self
Pr Border Color
Pr Text Letter Spacing
Sel Enable
Sel Attr Contain
Sel Required
Pr List Style
Css3 Pr Column Gap
Css3 Pr Flex Direction
Css3 Pr Text Decoration Color
Pr Border Top
Css3 Pr Transition
Func Linear Gradient
Css Colors Legal
Css3 Pr Overflow Style
Css3 Pr Box Lines
Pr Charset Rule
Sel Target
Css3 Pr Nav Right
Css3 Pr Column Count
Css3 Pr Background Clip
Pr Dim Min Width
Pr Class Position
Pr Margin
Pr Class Float
Pr Border Bottom Width
Css3 Pr Transform Origin
Css3 Pr Column Width
Css3 Pr Box Align
Sel First Of Type
Css3 Pr Border Top Left Radius
Pr Background Attachment
Sel Enabled
Pr Pos Left
Pr Tab Empty Cells
Css3 Pr Column Span
Pr Tab Table Layout
Pr Border Top Style
Css3 Pr Border Radius
Func Hsla
Css3 Pr Nav Left
Pr Padding Bottom
Css3 Pr Box Shadow
Css3 Pr Animation Iteration Count
Css Colornames
Pr Class Visibility
Pr Text White Space
Sel Read Write
Css3 Pr Flex Shrink
Css3 Pr Perspective
Css3 Pr Border Image Width
Css Colorsfull
Sel Nth Last Child
Sel Visited
Pr Font Font
Pr Border Bottom Color
CSS3 transition-duration Property
Example
Transition effect appears over the last 5 seconds:
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
The numbers preceding -webkit-, -ms-, or -moz- indicate the first browser version that supports the prefixed property.
| Property | |||||
|---|---|---|---|---|---|
| transition-duration | 26.0 <br>4.0 -webkit- | 10.0 | 16.0 <br>4.0 -moz- | 6.1 <br>3.1 -webkit- | 12.1 <br>10.5 -o- |
Property Definition and Usage
The transition-duration property specifies the length of time (in seconds or milliseconds) that a transition effect should take to complete.
| Default value: | 0 |
|---|---|
| Inherited: | no |
| --- | --- |
| Version: | CSS3 |
| --- | --- |
| JavaScript syntax: | object.style.transitionDuration="5s" |
| --- | --- |
Syntax
| Value | Description |
|---|---|
| time | Specifies the duration of the transition effect in seconds or milliseconds. |
| The default value is 0, which means no effect. |