CSS Value Time
The CSS Value Time, <time>, represents a time value expressed in seconds or milliseconds. It is used in animation, transition, and related properties.
Syntax:
<number>units
Property Values:
- <number>: It represents the amount of time or duration we want. It can be preceded by a single + or – sign.
- units: It is the representation. It can be s, ms.
Example 1:
<!DOCTYPE html> < html > < head > < style > div { width: 100px; height: 100px; background: green; position: relative; animation: mymove infinite; animation-duration: 3s;/*CSS | Time */ } @keyframes mymove { from {top: 0px;} to {top: 200px;} } </ style > </ head > < body > < center >< div ></ div ></ center > </ body > </ html > |
Output:
Example 2
<!DOCTYPE html> < html > < head > < style > div { width: 100px; height: 20px; background: green; transition: width 2s, height 4s;/*CSS | Time*/ } div:hover { width: 300px; height: 300px; } </ style > </ head > < body > < div >< p style = "color:white" >w3wiki</ p ></ div > </ body > </ html > |
Output:
Contact Us